| Autor | Zpráva | ||
|---|---|---|---|
| KristaX Profil * |
Poradil by někdo konkrétně, jak nastavit šířku horizontálního menu aby se zobrazovalo ve všech prohlížečích stejně? Nějak se mi to nedaří nastavit.
Ještě jeden dotaz, jde nějak (jak) nastavit aby se mi menu automaticky přizpůsobilo do šířky podle počtu odkazů a nezalomilo se mi na další řádek? Moc díky, zatím se učím a trénuji. Kód mám takto: ul#mainMenu {margin:auto;}
ul#mainMenu, ul {
color:000000;
padding:0;border:0px;
margin-left:0px;
list-style-type:none;width: 772px
}
ul#mainMenu ul {
margin-top:6px;border: 1px solid green;margin-left:-1px;
}
ul#mainMenu li {
float:left;padding:6px 0px;
width:19.7%;border: 1px solid fuchsia
}
ul#mainMenu a {
color:black;text-align: center;
background-color:yellow;
display:block;
text-decoration:none;
font-weight:bold;width:16.0%px;
}
ul#mainMenu ul a {
background-color:yellow;
}
ul#mainMenu ul a:hover {
color:blue;
text-align: right;
border: 1px solid black;
background-color:blue;
}
ul#mainMenu ul {
position:absolute;
visibility:hidden;
background-color:silver;
}
ul#mainMenu li:hover ul, ul#mainMenu li.hover ul{
visibility:visible;
}
ul#mainMenu li li {
float:none;
border:none;
padding:0;
}
ul#mainMenu li {
behavior: url(hover.htc); /* Protože IE nedodržuje CSS standarty, aby bylo řešení funkční, použijeme tento *.htc soubor */
}
#obsah {
width : 772px;
margin-top : 0px;
text-align : left;
border: 1px solid black;
}
</style>
<div id="obsah">
<table style="text-align: left; width: 772px; height: 70px;" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td>
<ul id="mainMenu">
<li><a href="#">Hlavní odkaz 1</a>
<ul>
<li><a href="#">Pododkaz 11</a></li>
<li><a href="#">Pododkaz 12</a></li>
<li><a href="#">Pododkaz 13</a></li>
</ul>
</li>
<li><a href="#">Hlavní odkaz 2</a>
<ul>
<li><a href="#">Pododkaz 21</a></li>
<li><a href="#">Pododkaz 22</a></li>
<li><a href="#">Pododkaz 23</a></li>
</ul>
</li>
<li><a href="#">Hlavní odkaz 3</a>
<ul>
<li><a href="#">Pododkaz 31</a></li>
<li><a href="#">Pododkaz 32</a></li>
<li><a href="#">Pododkaz 33</a></li>
</ul>
</li>
<li><a href="#">Hlavní odkaz 4</a>
<ul>
<li><a href="#">Pododkaz 41</a></li>
<li><a href="#">Pododkaz 42</a></li>
<li><a href="#">Pododkaz 43</a></li>
</ul>
</li>
<li><a href="#">Hlavní odkaz 5</a>
<ul>
<li><a href="#">Pododkaz 51</a></li>
<li><a href="#">Pododkaz 52</a></li>
<li><a href="#">Pododkaz 53</a></li>
</ul>
</li>
</ul>
</td>
</tr>
</tbody>
</table>
</div> |
||
| Bubák Profil |
#2 · Zasláno: 5. 4. 2008, 17:47:20
Vybodnul bych se na tabulku, sjednotil boxmodel a spočítal bych si rozměry.
|
||
| KristaX Profil * |
#3 · Zasláno: 5. 4. 2008, 17:57:37
Trošku jednodušeji prosím, chápu správně nedávat to do tabulky ale do nějakého divu?
|
||
| Měsíček Profil |
#4 · Zasláno: 5. 4. 2008, 18:07:37 · Upravil/a: Měsíček
ano
|
||
| KristaX Profil * |
#5 · Zasláno: 5. 4. 2008, 18:19:20
Ani tak mi to nejde, v mozille je to ok, ale v exploreru mám vpravo mezeru. Když nastavím větší šířku tak už se mi to v mozille nevejde vedle sebe.
|
||
| Bubák Profil |
#6 · Zasláno: 5. 4. 2008, 19:11:48 · Upravil/a: Bubák
Hlavně musíš sjednotit boxmodel. Máš zhruba tři možnosti.
1. Matrjoška, nejčistší řešení, ale pro začátečníky komplikované 2. použít DTD, která IE dá do standardního režimu, třeba: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 3. ponechat IE ve quirku (kompatibilní režim) a do CSS přidat: * {-moz-box-sizing: border-box; box-sizing: border-box;} |
||
| KristaX Profil * |
#7 · Zasláno: 5. 4. 2008, 20:53:04
Moc díky, ale nějak se mi nedaří :-( Jak přesně upravit kód co jsem napsala aby se mi zobrazilo menu zarovnané stejně i v IE?
DTD na stránkách používám: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> |
||
|
Časová prodleva: 16 let
|
|||
0