[ Поиск ] - [ Пользователи ] - [ Календарь ]
Полная Версия: Странное поведение CSS
alex12060
Доброго времени суток! Есть ссылка на сайте, она заключена в элемент header, для нее прописан стиль:


<header>
<!-- .... -->

<a href="" class="icon">Наши клиенты</a>



header a {
color: white;
}


И се верно, ссылка окрашена в белый, но, дополнив сайт новыми вещами и прописав такой стиль:


#blog_write a, a:visited {
color: #2590BE;
text-decoration: none;
}


Теперь ссылка окрашена в сини цвет (#2590BE), причем верхняя, находящаяся в header тоже, хотя здесь, в стиле, указано, что ссылки должны быть таким цветом только в элементе #blog_write.

В чем беда? У меня для разных блоков разные цвета, и верхняя ссылка окрашивается в последний добавленный, клиент ругается, а я туплю. Как побороть? Спасибо.




Спустя 4 минуты, 43 секунды (2.09.2012 - 15:29) redreem написал(а):
напиши

header a {
color: white !important;
}


и кстати

#blog_write a, a:visited {
color: #2590BE;
text-decoration: none;
}


наверно все же так надо:

#blog_write a, #blog_write a:visited {
color: #2590BE;
text-decoration: none;
}

Спустя 3 минуты, 24 секунды (2.09.2012 - 15:33) alex12060 написал(а):
redreem

Это проще всего, но, от этого ломается :hover, в принципе, нашел небольшое решение, просто стиль блога перенес в самое начало и все стили перекрлись, и заработало, но криво, но ладно пока. Мне бы узнать, почему такая вещь происходит?

Спустя 1 минута, 53 секунды (2.09.2012 - 15:34) redreem написал(а):
alex12060

это предмет каскадирования в CSS. <a> у тебя попадает под несколько правил и согласно правилам каскадирования браузер выбирает приоритетное. А !important кстати очень хорошая вещь, как раз и призванная уточнять приоритеты.

Цитата
Это проще всего, но, от этого ломается :hover,


что мешает прописать ховер для каждых случаев?

Спустя 3 часа, 35 минут, 42 секунды (2.09.2012 - 19:10) bobo написал(а):
C какого перепуга поведение то странное, при любых раскладах просто a { } будет иметь приоритет перед header a, footer a или ещечтото a.
А что б для каждого блока сделать свои цвета, то и прописывай для каждого блока свои цвета и свои псевдоклассы.
Быстрый ответ:

 Графические смайлики |  Показывать подпись
Здесь расположена полная версия этой страницы.
Invision Power Board © 2001-2024 Invision Power Services, Inc.