http://www.briligg.com/toll.html
Последние 3 элемента списка в текстовом разделе отображаются в виде ссылок, только когда указатель мыши находится над крайней правой стороной от них.Это единственное место, которое также вызывает изменение цвета фона: hover.Первые 2 работают нормально.CSS подтверждает.В html есть куча ошибок валидации, но ничего существенного.
Я не могу понять это.
Соответствующий css от строки 66 до 121 в документе briligg.cssи строки с 9 по 47 заголовка раздела документа HTML.HTML-код от строки 79 до 117.
внешний css:
.menutop, .menubottom, .menunow {
float: left;
width: 120px;
position: absolute;
}
.menutop li, .menubottom li {
list-style: none;
position: absolute;
left: 0;
margin: 10px 14px 5px 14px;
}
.menunow li {
border-bottom: 5px solid #52473f;
border-top: 10px solid #52473f;
border-left: 14px solid #52473f;
border-right: 14px solid #52473f;
outline: #3b3b3b solid 1px;
padding-bottom: 3px;
list-style: none;
position: absolute;
left: 0;
}
.menutop li, .menutop a, .menubottom li, .menubottom a {
width: 120px;
height: 120px;
display: block;
}
div.textmenu {
float: left;
width: 150px;
margin: 30px 10px 0 10px;
position: relative;
}
ul.textmenu {
position: absolute;
left: 0;
}
li.textmenu {
background-color: #52473f;
margin-bottom: 3px;
padding: 5px 7px;
border: 1px solid #3b3b3b;
width: 134px;
list-style: none;
text-align: right;
color: #fd8ee2;
}
li.textmenu a {
text-decoration: none;
color: #fd8ee2;
}
li.textmenu:hover {
background-color: #3b3b3b;
}
внутренний css:
.menutop {
height: 120px;
}
.menunow {
height: 120px;
top: 140px;
}
#frailty {
top: 0;
}
#frailty {
background: url(images/legdrugnav.png) 0 0;
}
#toll {
top: 0;
}
#toll {
background: url(images/legdrugnav.png) 0 -120px;
}
#option {
top: 135px;
}
#option {
background: url(images/legdrugnav.png) 0 -240px;
}
#weighing {
top: 270px;
}
#weighing {
background: url(images/legdrugnav.png) 0 -360px;
}
ul.textmenu {
top: 275px;
}
.menubottom {
height: 270px;
position: absolute;
top: 380px;
}
html:
<div class="textmenu">
<ul class="menutop">
<li class="menutop" id="frailty" title="Drug Use and Abuse">
<a href="frailty.html"></a>
</li>
</ul>
<ul class="menunow">
<li class="menunow" id="toll">
<a href="toll.html"></a>
</li>
</ul>
<ul class="textmenu">
<li class="textmenu">
<a href="toll.html#organized-crime">Prohibition funds organized crime</a>
</li>
<li class="textmenu">
<a href="toll.html#corruption">Prohibition causes corruption</a>
</li>
<li class="textmenu">
<a href="toll.html#kills">Prohibition kills</a>
</li>
<li class="textmenu">
<a href="toll.html#poverty">Prohibition means poverty</a>
</li>
<li class="textmenu">
<a href="toll.html#waste">Prohibition means wasted resources</a>
</li>
</ul>
<ul class="menubottom">
<li class="menubottom" id="option" title="the option">
<a href="option.html"></a>
</li>
<li id="weighing" title="the pros and cons">
<a href="weighing.html"></a>
</li>
</ul>
</div>