Всем привет. Пытаюсь дсделать адаптивные вкладки.
Есть HTML:
Код
<div class="tabs">
<input id="tab1" type="radio" name="tabs" checked>
<label for="tab1" title="Title1">Title1</label>
<input id="tab2" type="radio" name="tabs">
<label for="tab2" title="Title2">Title2</label>
<section id="content1">
...
</section>
<section id="content2">
...
</section>
</div>
И CSS:
Код
section {
display: none;
padding: 15px;
background: #fff;
border: 1px solid #ddd;
}
#tab1:checked ~ #content1,
#tab2:checked ~ #content2 {
display: block;
}
Можно ли как-нибудь изменить этот кусок кода, чтобы не прописывать для каждой вкладки?
Код
#tab1:checked ~ #content1,
#tab2:checked ~ #content2 {
display: block;
}
Что-то типа:
Код
#tab*:checked ~ #content* {
display: block;
}
Или всё таки придётся их вручную все прописывать? Спасибо.