Модераторы: Illuminaty
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Выпадающее меню в ИЕ на css, Проблема с... оформлением таблицы. 
V
    Опции темы
Murlblshka
Дата 26.9.2007, 05:17 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 2
Регистрация: 16.9.2007

Репутация: нет
Всего: нет



Вот код:

Код

<title>Документ без имени</title>

<STYLE type=text/css id="default" title="default" name="default">



*::-moz-any-link br,*:-moz-any-link br { 

/*a workarround for mozilla*/

display:none;

}

div#menu * {

  cursor: pointer; /*because IE displays the text cursor 

if the link is inactive*/

}
.sss1 {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 16px;
    font-style: normal;
    color: #000000;
    background-color: #046815;
    text-align: center;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-top-color: #FFFFFF;
    border-right-color: #FFFFFF;
    border-bottom-color: #FFFFFF;
    border-left-color: #FFFFFF;
    width: 100px;
    top: 50px;
    position: absolute;
    left: 50px;
}
.disabled {
   color: red !important;
   background: none !important;
}

div#menu {
   background: transparent;
   font: 15px Verdana, sans-serif;
   height: 15px;
   white-space: nowrap;
   width: 100%;
}
div#menu .a {
/*background: #F5F5DC;*/
   /*border: 1px solid #F5F5DC;*/
   color: #000000;
   text-decoration: none;
}

div#menu .a table {
   display: block;
   font: 10px Verdana, sans-serif;
   white-space: nowrap;
}

div#menu table, div#menu table a {
 display: none;
}

div#menu .a:hover, div#menu div.menuitem:hover {
    border: 1px solid #84bd84;
    color: #ffffFF;
    margin-right:-1px; /*resolves a problem with Opera not displaying the right border*/
    background-color: #1d5524;
}

div#menu .a:hover table, div#menu div.menuitem:hover table{
    background: #FFFFFF;
    border: 1px solid #708090;
    display: block;
    position: absolute;
    white-space: nowrap;
    margin-left: 15px;
}



div#menu .a:hover table a, div#menu div.menuitem:hover table a {
   border-left: 10px solid #708090;
   border-right: 1px solid white; /*resolves a jump problem*/
   color: #000000;
   display: block;
   padding: 1px 12px;
   text-decoration: none;
   white-space: nowrap;
   z-index: 1000;
}

div#menu .a:hover table a:hover, div#menu div.menuitem:hover table a:hover {
background: #7DA6EE;
   border: 1px solid #000000;
   border-left: 10px solid #000000;
   color: #000000;
   display: block;
   padding: 0px 12px;
   text-decoration: none;
   z-index: 1000;
}

td {
    padding: 0px;
    border-top-width: 0px;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
}

.menuitem {
    float: left;
    margin: 1px;
    padding: 1px;
}

.menuitem * {
   padding: 0px;
}

#other {
  height: auto;visibility: visible;
}

#moz{
  height: 1px;visibility: hidden;
}

#moz::-moz-cell-content{
  height: auto; visibility: visible;
}

#other::-moz-cell-content{
  height: 1px; visibility: hidden;
}

#holder {
  width: 133px;
}
body {
    background-color: #B9F7C0;
}
</STYLE>


</head>

<body>

<TABLE  id=holder class="sss1"  >

<TR>

<TD id="other">

<DIV id="menu">

    <DIV class="menuitem">

        <a class="a" href='#'><strong>File</strong><BR>

        <TABLE >

            <TR>

                <TD><a href=#2>click me</A></TD>

            </TR>

            <TR>

                <TD><a href=#3>Save</A></TD>

            </TR>

            <TR>

                <TD><a href=#4>Close</A></TD>

            </TR>

        </TABLE>

    </DIV>

    <DIV class="menuitem">

        <A class="a" href="#11"><strong>Help</strong><BR>

      <TABLE>

   <TR>

       <TD><a class="disabled">..</A></TD>

   </TR>

   <TR>

       <TD><a href=#13>Index</A></TD>

   </TR>

   <TR>

       <TD><a href="#14">About</A></TD>

          </TR>

      </TABLE>

    </DIV>

</DIV>

</TD>

</TR>


</TABLE><BR>

</body>
</html>



Мне нужно получить то что на картинке внизу, а получается то, что вверху. То есть, чтоб при наведении на ссылку "File" фон за ним раскрашивался в темно-зеленый, и не только вокруг букв, а пошире. Ну как на картинке, в общем.
user posted image
 Помогите, пожалуйста!! У меня не получается... :(

Это сообщение отредактировал(а) Illuminaty - 30.9.2007, 14:52
PM MAIL   Вверх
comcon1
Дата 28.9.2007, 09:14 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 838
Регистрация: 11.6.2005
Где: Москва ДАС-МГУ

Репутация: нет
Всего: 17



поперебирай колоры
Код

.disabled {
   color: red !important;
   background: none !important;
}

где-то здесь.

Это сообщение отредактировал(а) comcon1 - 28.9.2007, 15:18


--------------------
PM MAIL   Вверх
Murlblshka
Дата 28.9.2007, 13:24 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 2
Регистрация: 16.9.2007

Репутация: нет
Всего: нет



comcon1, простите я вас не очень поняла. В смысле совсем не поняла.
А в целом проблема решена.
PM MAIL   Вверх
comcon1
Дата 28.9.2007, 15:18 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 838
Регистрация: 11.6.2005
Где: Москва ДАС-МГУ

Репутация: нет
Всего: 17



Я тупой, простите.


--------------------
PM MAIL   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | Вёрстка веб-сайтов | Следующая тема »


 




[ Время генерации скрипта: 0.0485 ]   [ Использовано запросов: 21 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.