Я совершенно новичок в HTML, CSS и Javascript, но, опираясь на предыдущие знания о типичном программировании на Java и C, а также на многочисленные учебные пособия и поиски в Google, я составил очень грубое представление о том, как все это работает.
Теперь то, что сводит меня с ума, - это то, что я недавно добавил на свой веб-сайт поле со вкладками, которое находится на главной странице и позволяет выбрать один из 4 различных абзацев, нажав на соответствующую вкладку.Я извлек его из учебника и у меня есть общее представление о том, как он работает ... но по какой-то причине я не могу заставить его регулировать ширину каждой из этих вкладок.
Вот html
для вкладок:
<div id="feature-tabs">
<ul id="tabs">
<li><a href="#What We Do">What We Do</a></li>
<li><a href="#What Makes Us Different">What Makes Us Different</a></li>
<li><a href="#Our Background">Our Background</a></li>
<li><a href="#Why We Do It">Why We Do It</a></li>
</ul>
</div>`
А вот соответствующий CSS
, который его стилизует.
#feature-tabs {
height: 16px;
width: 150px;
}
ul#tabs {
list-style-type: none;
margin: 0 0 2 0;
}
ul#tabs li {
float: left;
}
ul#tabs li a {
color: #42454a;
background-color: #dedbde;
border: 1px solid #c9c3ba;
border-bottom: none;
text-decoration: none;
width: 150px;
}
ul#tabs li a:hover {
background-color: #f1f0ee;
}
ul#tabs li a.selected {
color: #000;
background-color: #f1f0ee;
font-weight: bold;
}
Мне это очень нужно, так как внешний вид, к которому я стремлюсь, ноЯ просто не могу понять, почему, куда бы я ни положил width: ___px;
, это просто не будет применяться.
Мне интересно, есть ли что-то, что я делаю, что мешает ширине быть применимой чертой, или что у вас есть.
Заранее спасибо.