Rozwijane menu...problem
Napisane: wtorek, 27 marca 2012, 09:54
Witam...rozsypalo mi sie menu i nie wiem co jest grane..kombinowalem, sprawdzalem i nie wychodzi mi. Probujac zrobic rozwijane menu dla sprawdzenia...tak jak w kursie wpisywalem sobie kilka razy text z </br> i juz tutaj pojawily sie problemy bo zostal on wyswietlony nap a nie pod linkiem z glownego menu....po stworzeniu listy nastapil koniec swiata..rozsypalo sie.myslalem ze to cos moze z wczesniejszymi display:inline-block...zamienialem je na rozne sposoby i nic....Prosze o pomoc:
Code: Zaznacz cały
<style type="text/css">
/*<![CDATA[*/
*
{
margin:0px;
padding:0px;
}
body
{
background-image: url('obrazki/vk_tlo.jpg');
}
#kontener
{
width:1004px;
margin:0px auto;
}
#gorna_cz_kontenera
{
position:relative;
background-image:url('obrazki/logo_tlo.gif');
width:944px;
height:150px;
}
img.logo
{
position:absolute;
left:20px;
top:50px;
}
#kontakt_box
{
position:absolute;
font-family:"Trebuchet MS", Helvetica, sans-serif;
font-size:12px;
color:grey;
line-height:120%;
top:30px;
right:30px;
}
a
{
color:teal;
text-decoration:none;
}
a:hover
{
color:#0000FF;
}
th
{
color:teal;
}
/*MENU GORNE*/
#gorne_menu
{
position:absolute;
left:30px;
bottom:0px;
}
{
list-style-type:none;
float:left;
border-right:2px solid black;
}
#wlasciwe_gorne_menu a
{
background-image:url('obrazki/gorne_menu.png');
height:32px;
border:none;
display:block;
float:left; /*dla pewnosci*/
padding:0px 10px;
font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size:10px;
font-weight:bold;
color:white;
}
span.link
{
display:block;
margin-top:10px;
}
#wlasciwe_gorne_menu li a:hover
{
background-image:url('obrazki/hover_gorne_menuu.gif');
color:#808080;
}
#srodkowe_menu
{
background-image:url('obrazki/sm_tlo.gif');
width:944px;
height:32px;
}
#srodkowe_menu li
{
list-style-type:none;
float:left;
font-family:"Trebuchet MS", Helvetica, sans-serif;
font-style:italic;
color:white;
padding:0px 10px;
}
#srodkowe_menu li span.link2
{
display:block;
margin-top:7px;
}
#srodkowe_menu li span.odstepik
{
display:block;
margin-top:7px;
}
#pierwszy_poziom
{
margin-left:30px;
}
#srodkowe_menu span.odstepik
{
display:block;
margin:5px 10px 0px 10px;
color:teal;
}
#srodkowe_menu li a:hover
{
color:white;
}
/*MENU ROZWIJANE*/
#pierwszy_poziom li .drugi_poziom
{
display:none;
}
/*]]>*/
</style>
</head>
<body>
<div align="center">
<div id="kontener">
<div id="gorna_cz_kontenera">
<img class="logo" src="obrazki/video-kurs-logo.gif.png" alt="logo"/>
<div id="kontakt_box">
<table>
<th>Kontakt:</th>
<tr><td>xxxxxxxx</td></tr>
<tr><td>xxx Gairn road</td></tr>
<tr><td>xxxxx Aberdeen</td></tr>
<tr><td>Mobile:xxxxxxxxx</td></tr>
<tr><td>e-mail:<a href="mailto:xxxxxx">xxxxxxxx</a></td></tr>
</table>
</div>
<!--koniec kontakt box-->
<div id="gorne_menu">
<ul id="wlasciwe_gorne_menu">
<li style="border-left:3px solid black;"><a href="#"><span class="link">Video Kursy</span></a></li>
<li><a href="#"><span class="link">Darmowe Lekcje</span></a></li>
<li><a href="#"><span class="link">Współpraca</span></a></li>
<li><a href="#"><span class="link">Forum</span></a></li>
<li><a href="#"><span class="link">Blog</span></a></li>
<li><a href="#"><span class="link">Sklep</span></a></li>
</ul>
</div>
<!--koniec gorne menu-->
</div>
<!--koniec gorna cz kontenera-->
<div id="srodkowe_menu">
<ul id="pierwszy_poziom">
<li><a href="#"><span class="link2">Czym są Video Kursy</span></a></li>
sdfsdsdg</br>
sdfsdsdg</br>
sdfsdsdg</br>
sdfsdsdg</br>
<li><span class="odstepik">:-:</span></li>
<li><a href="#"><span class="link2">Kursy Tworzenia stron WWW</span></a></li>
<ul class="drugi_poziom">
<li><a href="#"> HTML i CSS </a></li>
<li><a href="#"> PHP </a></li>
<li><a href="#"> MySQL </a></li>
<li><a href="#"> JavaScript </a></li>
<li><a href="#"> XML i DTD </a></li>
<li><a href="#"> Smarty </a></li>
</ul>
<li><span class="odstepik">:-:</span></li>
<li><a href="#"><span class="link2">Kursy Programowania</span></a></li>
<li><span class="odstepik">:-:</span></li>
<li><a href="#"><span class="link2">Kursy Matematyki</span></a></li>
</ul>
</div>
</div>
<!--koniec kontener-->
</div>
<!--koniec align=center-->
</body>
</html>