1 / 1 / 0
Регистрация: 04.07.2014
Сообщений: 13
1

Нужен совет по css

03.09.2014, 21:34. Показов 436. Ответов 3
Метки нет (Все метки)

Здравствуйте. Помогите найти ошибку. На сайте http://www.training.od.ua/ в верхнем меню, активная вкладка отображается нормально, а в боковом, при такой же самой последовательности css кода, активная вкладка не работает.

Часть кода, которая отвечает за боковое меню:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<div class="side-nav">
     <ul>
    <li class="side-nav-active"><a href="#">Daily News</a></li>
    <li><a href="#">Magazine</a></li>
        <li><a href="#">Maps</a></li>
    <li><a href="#">Science</a></li>
    <li><a href="#">Education</a></li>
    <li><a href="#">Games</a></li>
    <li><a href="#">Events</a></li>
    <li><a href="#">Blogs</a></li>
    <li><a href="#">Explorers</a></li>
    <li><a href="#">Trips</a></li>
    </ul>
</div>
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
.side-nav {
    position: relative;
    float: left;
    width: 18rem;
    ul {
        margin: 0;
        padding: 0;
        list-style-type: none;
    }
    ul:after {
        content: '';
        display: table;
        clear: both;
    }
    li {
        position: relative;
        float: left;
        margin: 0 .7rem .5rem 0;
        display: block;
        background: #fff;
        border: .1rem solid #eee;
        color: #777;
        a {
            margin: 0;
            text-align: center;
            font-size: 1.2rem;
            font-weight: bolder;
            color: #777;
            text-decoration: none;
            height: 6.8rem;
            width: 7.5rem;
            display: block;
            padding-top: 4.6rem;
        }
    }
}
.side-nav-active {
    color: #fff;
    background: #555;
    border: .1rem solid #555;
    a {
        color: #fff;
    }
}
0

Помощь в написании контрольных, курсовых и дипломных работ здесь.

Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
03.09.2014, 21:34
Ответы с готовыми решениями:

CSS/html справочник.нужен совет!
привет,хочу прикупить себе справочник по CSS,какой посоветуете? интересует книжный вариант! :)...

Нужен совет по css для выпадающего меню
Структура меню &lt;ul class=&quot;nice-menu1&quot;&gt; &lt;li&gt;&lt;a...&lt;/li&gt; &lt;li&gt;&lt;a...&lt;/li&gt; &lt;li&gt; &lt;a...&gt; ...

Стоит ли отдельно морочиться с CSS? Нужен только совет
Привет товарищам по профилю WEB, я, если честно сказать от веб дизайна очень далек и не мое это,...

Нужен совет: Как посредством CSS избежать вложенных тэгов
Суть в следующем - есть заголовок, как обычно &lt;h1&gt;.....&lt;/h1&gt;. Но вот по дизайн-замыслу он разбит на...

3
12 / 12 / 6
Регистрация: 30.07.2008
Сообщений: 65
05.09.2014, 15:42 2
Ну как же та последовательность? Самый простой вариант для вас. А вообще посоветовал бы вложенность в css полностью писать. Так понятнее будет и проще разобраться потом.
CSS
1
2
3
4
5
6
7
8
.side-nav-active {
    background: #555;
    border: .1rem solid #555;
    a {
        color: #FDD866;
        text-transform: uppercase;
    }
}
1
1 / 1 / 0
Регистрация: 04.07.2014
Сообщений: 13
06.09.2014, 11:21  [ТС] 3
Пупс, спасибо за ответ. Выложил код на cssdesk, там все работает, а на сайте этот же код не хочет работать. Активное меню берет правила не с

CSS
1
2
3
4
5
6
7
.side-nav-active {
  background: #555;
}
.side-nav-active a {
  border: .1rem solid #555;
  color: #fff;
}
а со строки

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
.side-nav {
 li {
   position: relative;
   float: left;
   margin: 0 .7rem .5rem 0;
   display: block;
   background: #fff;
   border: .1rem solid #eee;
   a {
    margin: 0;
    text-align: center;
    font-size: 1.2rem;
    font-weight: bolder;
    color: #777;
    text-decoration: none;
    height: 6.8rem;
    width: 7.5rem;
    display: block;
    padding-top: 4.6rem;
    }
   }
}
Использую LESS. Пробовал компилировать через winless и через crunch. Результат всегда один и тот же. Я уже не знаю с какой стороны подойти к этой проблеме.
0
12 / 12 / 6
Регистрация: 30.07.2008
Сообщений: 65
06.09.2014, 15:05 4
Цитата Сообщение от eckimoc Посмотреть сообщение
Использую LESS. Пробовал компилировать через winless и через crunch. Результат всегда один и тот же. Я уже не знаю с какой стороны подойти к этой проблеме.
Вам бы сначала научиться без препроцессоров работать.... Логику и все такое потренировать..
0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
06.09.2014, 15:05

Помощь в написании контрольных, курсовых и дипломных работ здесь.

Нужен совет по PHP/Ajax/MySQL/Javascript/HTML/CSS
Добрый день. Маленько не стандартная тема для этого форума, но все же решил создать. Уже вопрос...

Нужен совет!
Народ, подскажите. Кароче ситуация следующая, открыл домен и сайт месяца три назад, Яша, Рамблер...

Нужен совет
Ребят подскажите чем сейчас лучше мониторить позиции сайта точнее более четче чем site-auditor.

Нужен совет
Всем привет. Необходимо сделать сайт с кривыми блоками. Фон заливается картинками. Кто нибудь знает...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
4
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2021, vBulletin Solutions, Inc.