ul CSS property text-decoration се пренася на li-тата му. Защо?


0

http://130.204.204.146:8888/6-Homerwork-CSS/1/

Това е част от домашното за css от училищната академия - CSS - правила за позициониране и изглед.

Функционалността съм я направил, но идеята е, че когато се посочи List Item трябва той да бъде подчертан, но по някаква причина, тоя underline се пренася и на самите sublist items.

Какъв ми е тъпия проблем, както и тъпия фикс за това, щото съм 99% сигурен, че е толкова тъп фикс, че ще ми се иска да се гръмна като го видя. :D




Отговори



1

Подчертава всичко, защото sublist item-ите се намират в li-то, на което даваш hover (затварящият </li> таг е чак след тях). Ако искаш hover само на текста, можеш да го сложиш в един <span> в li-то (или <a>, ако е линк):

<li><span>List Item 1</span> ...

и след това в css-а:

ul li span:hover {
text-decoration:underline;
}

Това ще важи за всички span тагове, намиращи се в li. Можеш да го ограничиш по id, class и т.н.

И още нещо - id-тата трябва да са уникални. Използвай class, когато ти трябват еднакви стилове на различни елементи. :)


от svetlai (1438 точки)


0
Благодаря, колежке, още се уча :) 

от dubplay (115 точки)


1

По всяка вероятност го наследява от UL-а, пробвай изрично на LI-та да дадеш text-decoration: none; например:

ul > li{

    text-decoration: none;

}


от topalkata (6442 точки)


1

Пробвай така

li{
    float: left;
    clear: both;
}
#level-1-item{
    text-decoration: underline;
}