Код:
#menu li {
float: left;
vertical-align: middle;
}
#menu li a {
display: block;
background-color: #fff;
width: 22px;
text-transform: uppercase;
color: #999;
text-decoration: none;
height: 15px;
vertical-align: middle;
}
#menu li a:hover {
display: block;
width: 22px;
text-transform: uppercase;
color: #666;
text-decoration: none;
background-color: #fff;
border-bottom: 1px solid #20BFDC;
vertical-align: middle;
}
#amenu li a {
height: 15px;
color: #333;
width: 22px;
background-color: #fff;
border-bottom: 1px solid #20BFDC;
vertical-align: middle;
}
#amenu li a:hover {
height: 15px;
color: #333;
width: 22px;
background-color: #fff;
border-bottom: 1px solid #20BFDC;
vertical-align: middle;
}
#navigation {
float: left;
}
#feed {
float: right;
padding-bottom: 10px;
text-align:right;
}
#feed img {
border: 0px;
}Кода на менюто ми .... идеята ми е - между 'бутоните'(надписите) да има някакво място , а като поставя мишката върху някой от тях , да се подчертава с линия ... проблемът е , че тази линия е с широчината на бутона , а аз искам да е по-къса - колкото надписа ( Всъщност , мен'то ми е азбучник - от буквите - като всяка буква ми е бутон , като искам тя да се подчертава като се постави мишката отгоре й )
Като го намаля широчината на подчертаващата линия от този блок
Код:
#menu li a:hover {
display: block;
width: 22px;
text-transform: uppercase;
color: #666;
text-decoration: none;
background-color: #fff;
border-bottom: 1px solid #20BFDC;
vertical-align: middle;всичко изглежда добре , има си 22 пиксела разстояние между бутоните , линийкат за подчертаване от 22 става колкото ми е необходимо , но ... като дам върху бутона , съседния бутон се придвижва до подчертаната линията и се нагъчкват надписите един върху друг ... та , нещото , което искам да направя/постигна е - да имам 22 пиксела разстояние между бутоните , 10 пиксела широчина на подчертаващата линия и като поставя мишката върху някой бутон - съседният да не се премества , а да си останат на 22 пиксела разстояние :? Дано съм обяснил добре ...
