Autor Zpráva
Klasik
Profil *
Ahoj, mám kody na css + html.. Všechno je ok, ale když ukážete na menu, které se vyroluje tak vyrolovaná políčka se schovají pod spojdí layout



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>laylout pomocí pozicování v CSS</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<link rel="stylesheet" type="text/css" href="cssstyle.css" media="screen" title="style (screen)" />


<body>
<div class="obal">

<div class="head">
Hlavička , obrazek, a ostatní kraviny
</div><!--konec hlavičky -->

<div class="head1">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-8" />
<meta http-equiv="content-language" content="cs" />
<meta http-equiv="imagetoolbar" content="no" />
<meta name="description" content="Vodorovné vysouvací menu." />
<meta name="keywords" content="Vysouvací menu, hover menu" />
<meta name="author" content="Jiří Černý (tvorbawebu@email.cz)" />
<meta name="robots" content="all,follow" />

<link rel="stylesheet" type="text/css" href="menu/hover_menu/style.css" media="screen" />
</head>
<body>

<div id="vodorovne-menu">
<ul>
<li><a href="#">Hlavní strana</a></li>
<li><a href="#">Reference</a>
<ul>
<li><a href="#">Loga</a></li>
<li><a href="#">3D</a></li>
<li><a href="#">Webdesign</a></li>
</ul>
</li>
<li><a href="#">Blog</a>
<ul>
<li><a href="#">PHP</a></li>
<li><a href="#">CSS</a></li>
<li><a href="#">C++</a></li>
</ul>
</li>
<li><a href="#">Kontakt</a></li>
</ul>
</div>


</body>
</html>

</div><!--konec hlavičky -->

<div class="pravy">
Pravý sloupes a další texty, ikonky, reklama...
</div><!--konec pravého sloupce -->

<div class="obsah">
Hlavní odsah stránky a další texty
</div><!--konec hlavního obsahu -->

</div><!--konec obal -->

</body>
</html>



*{margin: 0;padding: 0;}

body { behavior: url("csshover3.htc"); font-size:90%;}

/* menu */
#vodorovne-menu {width: 100%;margin: 10px;}
#vodorovne-menu li {float:left;list-style-type:none;}
#vodorovne-menu li a {display:block; height:24px;width: 110px;line-height:24px; text-align:center; text-decoration:none;color:#000;}
#vodorovne-menu li a:hover { background: #0E3D6F; color:#fff;}
#vodorovne-menu li ul {display:none;}
#vodorovne-menu li:hover ul { display:block; position:absolute; border: solid #F0F0F0; border-width:0 1px 1px 1px;}
#vodorovne-menu li:hover ul li { display:block; float:none; height:24px; width: 110px; border-top: 1px solid #F0F0F0;}
#vodorovne-menu li:hover ul li a {background:#fff;}
#vodorovne-menu li:hover ul li a:hover {background: #0E3D6F;color:#fff;}

#vertikalni-menu{clear:both;width: 100%;margin: 25px;}
#vertikalni-menu li {list-style-type:none;position:relative;width: 110px;}
#vertikalni-menu li a {display:block; height:24px;width: 104px;line-height:24px;text-decoration:none; color:#000;padding: 0 3px;}
#vertikalni-menu li a:hover { background: #0E3D6F; color:#fff;}
#vertikalni-menu li ul{position:absolute;top:0;left:100px;visibility:hidden;}
#vertikalni-menu li:hover ul{visibility:visible;display:block;position:absolute;border: solid #F0F0F0; border-width:0 1px 1px 1px;}
#vertikalni-menu li:hover ul li { display:block;position:relative; float:none; height:24px; width: 110px; border-top: 1px solid #F0F0F0;}
#vertikalni-menu li:hover ul li a {background:#fff;}
#vertikalni-menu li:hover ul li a:hover {background: #0E3D6F;color:#fff;}
SwimX
Profil
Klasik:
1) vkládej kódy do
2)
<div class="head1"> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-8" /> 
<meta http-equiv="content-language" content="cs" /> 
<meta http-equiv="imagetoolbar" content="no" /> 
<meta name="description" content="Vodorovné vysouvací menu." /> 
<meta name="keywords" content="Vysouvací menu, hover menu" /> 
<meta name="author" content="Jiří Černý (tvorbawebu@email.cz)" /> 
<meta name="robots" content="all,follow" /> 

<link rel="stylesheet" type="text/css" href="menu/hover_menu/style.css" media="screen" /> 
</head> 
<body>


to asi nebude zrovna to pravé ořechové, že?

Sice to neřeší tvůj problém, ale takle to rozhodně správně není.

Zkus kouknout na Menu v CSS Knihovně

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: