Проблемы со скрытием элементов через css

Поделиться1Сб, 10 Дек 2011 10:44:41

Автор: Laktonika
Заслуженный
Зарегистрирован: Вс, 12 Дек 2010
Сообщений: 785
Уважение: +94
Позитив: +214
Последний визит:
Вт, 23 Апр 2024 00:32:08

http://territory.rolbb.ru/
Через стиль, первое окно, скрыла на гланой "Тем" и "Ответов". Но оно скрылось и внутри разделов, а этого не надо было.
Плюс по ссылке участники стали отображаться только ники, вся информация справа исчезла.
Меняла настройки в пределах CS2.
Помогите, пожалуйта, решить проблему.

0

Поделиться2Сб, 10 Дек 2011 10:47:19

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51115
Уважение: +15197
Позитив: +11571
Последний визит:
Сегодня 08:38:44

Laktonika
Там де то ты в старых скриптах копировала скрипто-сss код - действие действие элементов стиля на отдельно выбранных страницах
поставь в с начало селектора

#pun-index (вместо .punbb - де код то ?

#pun-index .main .tc2, #pun-index .main .tc3, #pun-index .main .tcmod {
display: none;
}

Отредактировано Deff (Сб, 10 Дек 2011 10:51:19)

+1

Поделиться3Сб, 10 Дек 2011 11:08:50

Автор: Laktonika
Заслуженный
Зарегистрирован: Вс, 12 Дек 2010
Сообщений: 785
Уважение: +94
Позитив: +214
Последний визит:
Вт, 23 Апр 2024 00:32:08

~~нэнэнэ, проще ж через стиль~~
Сяп, всё стало нормаль
Что не создавать отдельную тему, сразу тут спрошу: можно у тебя попросить сделать одну [цензура]? суть в том, что слева наверху находится фиксированная кнопка, при наведении вниз выпадает меню, при наведении на пункты меню выпадает вправо то, что соответствует пункту
если надо, сделаю эскиз и приведу пример выпадающего списка

Отредактировано Laktonika (Сб, 10 Дек 2011 11:10:40)

0

Поделиться4Сб, 10 Дек 2011 11:19:18

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51115
Уважение: +15197
Позитив: +11571
Последний визит:
Сегодня 08:38:44

Ничо не понял... пробуй свои эскизы выложить( хотя занят малёк

0

Поделиться5Сб, 10 Дек 2011 11:29:24

Автор: Laktonika
Заслуженный
Зарегистрирован: Вс, 12 Дек 2010
Сообщений: 785
Уважение: +94
Позитив: +214
Последний визит:
Вт, 23 Апр 2024 00:32:08

Deff
В левом верхнем углу фиксированная кнопка. Эскиз:

Эффект выпадения - обыкновеннейший, пример: http://heavenschool.ru/, над таблицей есть ряд кнопок (Администрация, Полезные ссылки и др. ...)
Плюс рамку у аватаров: белые бордеры 3-5пкс с закругленными краями + черная тень без смещения, радиусом 10пкс

Отредактировано Laktonika (Сб, 10 Дек 2011 11:55:16)

0

Поделиться6Сб, 10 Дек 2011 11:34:12

Автор: Laktonika
Заслуженный
Зарегистрирован: Вс, 12 Дек 2010
Сообщений: 785
Уважение: +94
Позитив: +214
Последний визит:
Вт, 23 Апр 2024 00:32:08

Мм, еще возникла проблема:

Знаю, что проблема скорее всего, в процентах (в том же CS2), но не уверена, как подвинуть границу вправо так, чтоб не испортить предыдущие настройки

0

Поделиться7Сб, 10 Дек 2011 13:14:32

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51115
Уважение: +15197
Позитив: +11571
Последний визит:
Сегодня 08:38:44

Laktonika
Ни наю - Пробуй в Конец первого Окна

#pun-searchtopics .main{
float:none;
padding-left:4%;
width:90%!important;
}
#pun-searchtopics .main .tcl{
width:70%!important;
}
#pun-searchtopics .main .tc2 {
text-align: left;
width:40%!important;
}
#pun-searchtopics .main .tc3 {
text-align: left;
width:10%!important;
}

+1

Поделиться8Сб, 10 Дек 2011 13:16:11

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51115
Уважение: +15197
Позитив: +11571
Последний визит:
Сегодня 08:38:44

Laktonika
С кнопками не сегодня - пробуй поставить меню от герды - типо по наведению ( потом переделаем по клику

0

Поделиться9Сб, 10 Дек 2011 19:07:52

Автор: Laktonika
Заслуженный
Зарегистрирован: Вс, 12 Дек 2010
Сообщений: 785
Уважение: +94
Позитив: +214
Последний визит:
Вт, 23 Апр 2024 00:32:08

Deff
Ненене, я уже пробовала, ничо не выходит, потому и пришла к тебе.
Дело не горит, делай, когда удобно.

0

Поделиться10Вс, 18 Дек 2011 15:13:50

Автор: Laktonika
Заслуженный
Зарегистрирован: Вс, 12 Дек 2010
Сообщений: 785
Уважение: +94
Позитив: +214
Последний визит:
Вт, 23 Апр 2024 00:32:08

Deff
Не навязываюсь, но скажи, ты браться-то будешь?) Чтобы знать, ждать или нет...

0

Поделиться11Вс, 18 Дек 2011 17:26:02

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51115
Уважение: +15197
Позитив: +11571
Последний визит:
Сегодня 08:38:44

Laktonika
Эммм - честно гря забыл уже... :blush: Седни - не охота.....

Laktonika написал(а):

Дело не горит, делай, когда удобно.

Удобно после НГ, точнее после 13 - поскольку сейчас - Теребят с долгами этого года( не хочу еще одно обязательство взваливать... тут и так урывками от одного - к другому - (наверняка получицо валенок, который еще переделывать несколько раз...

0

Поделиться12Вс, 18 Дек 2011 17:37:54

Автор: Laktonika
Заслуженный
Зарегистрирован: Вс, 12 Дек 2010
Сообщений: 785
Уважение: +94
Позитив: +214
Последний визит:
Вт, 23 Апр 2024 00:32:08

Deff
Черт, долго Х.Х
Ладно, буду ждать после 13-го.

0

Поделиться13Вс, 18 Дек 2011 20:00:10

Автор: Laktonika
Заслуженный
Зарегистрирован: Вс, 12 Дек 2010
Сообщений: 785
Уважение: +94
Позитив: +214
Последний визит:
Вт, 23 Апр 2024 00:32:08

Deff
Слепила основу, от которой будешь отталкиваться, может, легче будет
Стиль:

Код:

#nav {padding: 10px 10px 10px 10px; list-style:none; height:45px; background-color: transparent;}

#nav li.top {display:block; float:left; height:38px;}
#nav li a.top_link {display:block; float:left; height:45px; line-height:33px; color:#000; text-decoration:none; font-size:11px; font-weight:bold; padding:0 0 0 24px; cursor:pointer;}

#nav li a.top_link span {float:left; display:block; padding:0 24px 0 24px; height:45px}

#nav li a.top_link span.down {float:left; display:block; padding:0 24px 0 24px; height:45px; background-color: #CDAA7D; border: 3px solid #8B7355; border-radius: 10px;}

#nav li:hover a.top_link, 
#nav li.iehover a.top_link {color:#000; background-color: transparent; cursor:pointer;}

#nav li:hover a.top_link span,
#nav li.iehover a.top_link span {background-color: transparent; cursor:pointer;}
#nav li:hover a.top_link span.down,
#nav li.iehover a.top_link span.down {background:url() no-repeat right top; cursor:pointer;}

/* Default list styling */

#nav li:hover {position:relative; z-index:200; cursor:pointer; background-color: #F5DEB3;}

#nav li:hover ul.sub
{left:0px; top:38px; background-color: transparent; border: 0px; padding:3px; white-space:nowrap; width:150px; height:auto; z-index:300; cursor:pointer;}
#nav li:hover ul.sub li
{display:block; height:20px; position:relative; float:left; width:150px; font-weight:normal; cursor:pointer;}

#nav li:hover ul.sub li a
{display:block; font-size:11px; height:18px; width:150px; line-height:18px; text-indent:5px; color:#000; text-decoration:none; cursor:pointer; background-color: transparent; border: 0px;}

#nav li ul.sub li a.fly
{background-color: #CDAA7D; border: 3px solid #8B7355; cursor:pointer;}
#nav li:hover ul.sub li a:hover
{background-color: #CDAA7D; border: 3px solid #8B7355; cursor:pointer;}

#nav li:hover ul.sub li a.fly:hover
{background-color: #F5DEB3; border: 3px solid #8B7355; cursor:pointer;}

#nav li:hover li:hover ul,
#nav li:hover li:hover li:hover ul,
#nav li:hover li:hover li:hover li:hover ul,
#nav li:hover li:hover li:hover li:hover li:hover ul
{left:150px; top:0px; background: #F5DEB3; border: 3px solid #8B7355; white-space:nowrap; width:auto; z-index:500; height:auto;}

#nav ul, 
#nav li:hover ul ul,
#nav li:hover li:hover ul ul,
#nav li:hover li:hover li:hover ul ul,
#nav li:hover li:hover li:hover li:hover ul ul
{position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}

#nav li:hover li:hover a.fly,
#nav li:hover li:hover li:hover a.fly,
#nav li:hover li:hover li:hover li:hover a.fly,
#nav li:hover li:hover li:hover li:hover li:hover a.fly
{background-color: #CDAA7D; border: 3px solid #8B7355; color:#000; } 

#nav li:hover li:hover li a.fly,
#nav li:hover li:hover li:hover li a.fly,
#nav li:hover li:hover li:hover li:hover li a.fly
{background-color: #CDAA7D; border: 3px solid #8B7355;}

Код самой шняги:

Код:

<ul id="nav">
 <li class="top"><a href="" id="" class="top_link"><span class="down">НАВИГАЦИЯ</span></a>

    <ul class="sub">
    <li><a href="" class="fly">Основное</a>
        <ul>
            <li><a href="ссылка">1</a></li>
            <li><a href="ссылка">2</a></li>
            <li><a href="ссылка">3</a></li>
            <li><a href="ссылка">4</a></li>
            <li><a href="ссылка">5</a></li>
            </ul>
    </li>
       


    <li><a href="" class="fly">Администрация</a>
        <ul>
            <li><a href="ссылка">1</a></li>
            <li><a href="ссылка">2</a></li>
            <li><a href="ссылка">3</a></li>
            </ul>
    </li>
        


    <li><a href="" class="fly">Погода в Игре</a>
        <ul>
            <li><table><tr><td><center><b></b></center></td><td><center><b></b></center></td><td><center><b></b></center></td><td><center><b></b></center></td>
</tr><tr><td></td><td></td><td></td><td></td></tr></table></li>
            </ul>
    </li>
       


    <li><a href="" class="fly">События</a>
        <ul>
            <li><div style="width: 250px; height: 200px; overflow-y: scroll;"><center><b>Дата.</b></center><br><br>
Текст новости под датой.</div></li>
            </ul>
    </li>
        </ul>
    </li>

Поправить во всём этом косяки, сделать так, чтобы таблица и прокрутка отображались в выпадающем списке, сменить цвета (при наведении на пункт списка вываливается второй, надо чтобы второй был таким же, как и первый), закруглить только нижние края, сделать надпись "Навигация" строго по центру кнопки. Саму кнопку приклеить наверх влево экрана.
И все бэкграунд-цвета поменять на примерно такие, как на скрине.
Вроде всё х. х

+1