私はcssにこのタブのセットを持っています:
/*tabs*/
.tabs {
position: relative;
min-height: 200px;
clear: both;
margin: 25px 0;
}
.tab {
float: left;
}
.tab label {
background: #eee;
padding: 10px;
margin-left: -1px;
position: relative;
left: 1px;
}
.tab [type=radio] {
display: none;
}
.tab-content {
position: absolute;
top: 28px;
left: 0;
background: #f7faff;
right: 0;
bottom: 0;
padding: 20px;
border: 1px solid red;
}
[type=radio]:checked ~ label {
background: white;
border-bottom: 1px solid white;
z-index: 2;
}
[type=radio]:checked ~ label ~ .tab-content {
z-index: 1;
}
ここから: http://css-tricks.com/functional-css-tabs-revisited/
それらを垂直に積み重ねるにはどうすればよいですか?Css は私の専門分野ではなく、現在取り組んでいるものをいじりながら、ここで質問したいと思いました。純粋な css 実装を保持しようとしていますが、タブを垂直方向に左または右に積み重ねます。