Помогите исправить скрипт

angor2005 · 14 янв 2011, 08:37

Вот скрипт созданный при помощи PURE CSS Menu Make. Подскажите где вставить, и что исправить для размещения этого меню в желаемом месте экрана.

Код: Выделить всё

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

<title>Your PURE CSS Menu</title>

<!-- Start required PURE CSS Menu markup for head tag -->
<link href="cm-style.css" rel="stylesheet" type="text/css">
<!-- End required PURE CSS Menu markup for head tag -->

</head>

<body style="background:#FFFFFF">

<div style="display: table">

<!-- Start required PURE CSS Menu markup for body tag -->
<ul id="cm-nav" class="arrow-pad">
   <li><a href="http://cssmenu.com/sample/page.htm" class="arrow">My Menu</a>
      <ul>
         <li><a href="http://cssmenu.com/sample/page.htm">My sub menu item 1</a></li>
      </ul>
   </li>
</ul>
<!-- End required PURE CSS Menu markup for body tag -->

</div>

</body>

<style>
/* Generated by PURE CSS Menu Maker. This file may be modified freely. */


#cm-nav li a.arrow {background-image: url(arrow-right.gif)}

ul#cm-nav ,
ul#cm-nav ul {
 border-bottom: black 1px solid;
 list-style-type: none;
 margin: 0px;
 list-style-image: none;
 border-right: black 1px solid;
 padding: 0px
}

ul#cm-nav li {
 position: relative;
 list-style-type: none;
 margin: auto;
 list-style-image: none;
 padding: 0px
}

ul#cm-nav li li {
 width: auto;
 float: none
}

#cm-nav a {
 text-align: left;
 border-left: black 1px solid;
 display: block;
 font-family: verdana;
 white-space: nowrap;
 background: yellow;
 color: black;
 font-size: 12px;
 border-top: black 1px solid;
 text-decoration: none;
 padding: 5px
}

#cm-nav a:focus {
 outline-style: none;
 outline-color: invert;
 outline-width: medium
}

#cm-nav a.no-click {cursor: default}

#cm-nav > li > a ,
#cm-nav > li > a.arrow {padding-right: 4px}

.arrow-pad#cm-nav > li > a ,
#cm-nav ul.arrow-pad > li > a {padding-right: 11px}

#cm-nav li a.arrow ,
#cm-nav > li > a.arrow {
 background-repeat: no-repeat;
 background-position: right 50%
}

#cm-nav li:hover > a {
 background-color: red;
 color: white
}

#cm-nav li ul ,
#cm-nav li:hover ul ul ,
#cm-nav li:hover ul ul ul ,
#cm-nav li:hover ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul {
 z-index: 999;
 position: absolute;
 display: none
}

#cm-nav li:hover ul ,
#cm-nav li li:hover ul ,
#cm-nav li li li:hover ul ,
#cm-nav li li li li:hover ul ,
#cm-nav li li li li li:hover ul ,
#cm-nav li li li li li li:hover ul ,
#cm-nav li li li li li li li:hover ul ,
#cm-nav li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li li li li li li li li li li li:hover ul {
 display: block;
 margin-left: 100%
}

#cm-nav ul ul {margin-left: 0px}

#cm-nav ul {
 top: 0px;
 left: 0px
}
</style>

</html>

Игорь Акопян · 19 янв 2011, 11:57

есть такая чудная надстройка к Firefox называется FireBug - с её помощью очень легко найти элемент стиля который отвечает за меню, как мне кажется навскидку это раздел ul#cm-nav
так же по-ламерски предполагаю, что надо будет добавить тэг position, что тоже можно налету сделать в файрбаге. А вот какие параметры указывать - это подробно описано тут http://css.manual.ru/