Разворачивающееся меню

Код:

<ul class="menu_p">
  <li>
      <p>Заголовок меню</p>
      <ul>
        <li><a href="#">Пункт первый </a></li>
        <li><a href="#">Пункт два</a></li>
        <li><a href="#">Пункт идущий третьим</a></li>
        <li><a href="#">Пункт четвертый и последний</a></li>
      </ul>
  </li>
  <li>
      <p>Заголовок меню 2</p>
      <ul>
        <li><a href="#">2 Пункт первый </a></li>
        <li><a href="#">2 Пункт два</a></li>
        <li><a href="#">2 Пункт идущий третьим</a></li>
        <li><a href="#">2 Пункт четвертый и последний</a></li>
      </ul>
  </li>
</ul>

Код:

.menu_p, .menu_p ul {
        margin: 20px 0 0 0;
        padding: 0;
        list-style: none outside none;
        z-index: 999 !important;
}
.menu_p {
        width: auto;
        margin: 2px;
}
.menu_p:before, .menu_p:after {
        content: "";
        display: table;
}
.menu_p:after {
        clear: both;
}
.menu_p {
        zoom:1;
}
.menu_p li {
        float: left;
        position: relative;
        margin-right: 10px;

}
.menu_p p {
        width: auto;
        height: auto;
        float: left;
        padding: 5px;  /*отступ для текста внутри заголовка обеих менюшек*/
        outline: none;
        border: 1px solid #273430;
        border-radius: 8px;
        -webkit-transition: all .2s ease-in-out;
        -moz-transition: all .2s ease-in-out;
        -ms-transition: all .2s ease-in-out;
        -o-transition: all .2s ease-in-out;
        transition: all .2s ease-in-out;
        margin-top: 5px; /*отступ от верхнего края названия форума для заголовков обеих менюшек*/
        color: #e5f2d1 !important; /*цвет заголовков*/
        background: url('http://igriprestolov.rolka.su/files/0010/c5/8f/70917.png'); /*фон под заголовками*/
        text-align: center;
        z-index: 999 !important;
}
.menu_p ul {
        margin: 20px 0 0 0;
        _margin: 0; /*IE6 only*/
        opacity: 0;
        visibility: hidden;
        position: absolute;
        top: 30px;  /*отступ всплывающих контейнеров*/
        left: 0;
        z-index: 999 !important;
        background: url('http://igriprestolov.rolka.su/files/0010/c5/8f/70917.png'); /*полупрозрачный фон под обе менюшки*/
        border: 1px solid #273430; /*границы для менюшек*/
        padding: 5px;  /*отступ для текста внутри обеих менюшек*/
        border-radius: 8px;
        -webkit-transition: all .2s ease-in-out;
        -moz-transition: all .2s ease-in-out;
        -ms-transition: all .2s ease-in-out;
        -o-transition: all .2s ease-in-out;
        transition: all .2s ease-in-out;
}
.menu_p li:hover > ul {
        opacity: 1;
        visibility: visible;
        margin: 0;
        z-index: 999 !important;
       
}
.menu_p ul ul {
        top: 0;
        left: 150px;
        margin: 0 0 0 20px;
        _margin: 0; /*IE6 only*/
        z-index: 999 !important;
       
}
.menu_p ul li {
        float: none;
        display: block;
        border: 0;
        _line-height: 0; /*IE6 only*/
        z-index: 999 !important;
}
.menu_p ul a {
        padding: 3px;
        margin: 5px;
        _height: 10px; /*IE6 only*/
        display: block;
        white-space: nowrap;
        float: none;
        text-transform: none;
        outline: none;
        color: #e5f2d1 !important; /*цвет ссылок в менюшках*/
        z-index: 999 !important;
}
.menu_p ul a:hover {
        background: url('http://igriprestolov.rolka.su/files/0010/c5/8f/67479.png');  /*цвет подсветки ссылок*/
        margin: 5px;
        border-radius: 5px;
        z-index: 999 !important;
}

.menu_p::before, .menu_p::after {
content: "";
display: table;
}

li {
display: list-item;
 }

ShMaster пишет:Адрес форума - http://igriprestolov.gip-gip.ru

.menu_p ul {
margin: 20px 0 0 0;
_margin: 0; /*IE6 only*/
opacity: 0;
visibility: hidden;
position: absolute;
top: 30px; /*отступ всплывающих контейнеров*/
left: 0;
z-index: 999 !important;
background: url('http://igriprestolov.rolka.su/files/0010/c5/8f/70917.png'); /*полупрозрачный фон под обе менюшки*/
border: 1px solid #273430; /*границы для менюшек*/
padding: 5px; /*отступ для текста внутри обеих менюшек*/
border-radius: 8px;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}

Код:

background-color:#050A0C;

Код:

.pun table .tcl {
overflow: hidden;
text-align: left;
width: 50%;
}