| Autor | Zpráva | ||
|---|---|---|---|
| vaschez Profil * |
Dobrý den,
měla bych prosbu. Mám stránku s 3 sloupci s různou šířkou. Nad prostředním sloupcem chci horizontální menu,nad ostatníma je ve stejné úrovni stejně široký pruh. Menu řeším klasicky jako ul, li, celé menu má svůj div(div#hornimenu) stejně jako sousedící dva pruhy ( div#pred, div#za). a to celé jsem opět dala do divu (div#hornilista). Tím sjem myslela, že je všem prohlížečům jasné, jak to zobrazovat. IE mi rozumí a zobrazuje vše správně, ovšem Moz Fir si dělá co chce a když mám vše xkrát přepočítané, tak odmítá řadit menu a pruhy do stejné úrovně. A ještě mi přijde, že Moz Fir nerespektuje výšku pruhu zadanou v px a text mi háže pod. Díky moc za pomoc. Veronika div#hornilista {
wid th: 989px;
height: 20px;
border-bottom: 4px solid white;
margin: 0px;
padding: 0px;
}
div#pred {
width: 150px;
height: 20px;
background-color: rgb(229,229,229);
float: left;
margin: 0px;
}
div#hornimenu {
height: 20px;
widt h: 582px;
text-align: center;
display: block;
border-left: 7px solid white;
float: left;
margin: 0px;
padding: 0px;
}
div#hornimenu a {
display: inline-block;
width: 108px;
height: 20px;
text-align: center;
paddi ng-top: 7px;
text-decoration: none;
font-size: 11px;
text-align: center;
color: white;
}
div#hornimenu a#kuchyne {
background: rgb(153,255,51);
borde r-left: 7px solid white;
}
div#hornimenu a#satniskrine {
background: rgb(255,144,0);
}
div#hornimenu a#loznice {
background: rgb(255,0,0)
}
div#hornimenu a#dvere {
background: rgb(51,102,255);
}
div#hornimenu a#ostatni {
background:rgb(153,51,153) ;
}
div#hornimenu a:hover {
background-color: red;
text-decoration: underline;
color: black;
width: 108px;
font-size: 10px;
height: 20px;
text-decoration: none;
}
div#za {
width: 250px;
height: 20px;
background-color: rgb(229,229,229);
float: right;
}Moderátor Davex: Vkládej prosím kódy mezi značky [pre] a [/pre] (stačí kliknout na
 ). |
||
| margin Profil * |
#2 · Zasláno: 16. 1. 2011, 19:50:44
Vidím tu float, ale nikde žádný clear, více Jak funguje „float“ a „clear“.
Navíc mám malou představivost, tak si nedokáži z tvého CSS odvodit HTML, chtělo by to odkaz na živou ukázku. |
||
| vaschez Profil * |
#3 · Zasláno: 16. 1. 2011, 20:42:31
Tak Váš odkaz pečlivě studuji, doplnila jsem si i hr čistič, nicméně mi přijde, že problém je v tom, že mozilla svéhlavě centruje menu doprostřed stránky - i když se o to nikdo neprosí.:) Nějaká rada?
|
||
| panther Profil |
#4 · Zasláno: 16. 1. 2011, 20:44:31
vaschez:
pleteš se, prohlížeč nikdy nedělá to, co mu není předepsáno ve stylopisu. „Nějaká rada?“ bez odkazu na web těžko. Nedává dostatek informací a tunami kódu se prohrabovat nebudu. |
||
| zvěřiňák Profil |
#5 · Zasláno: 16. 1. 2011, 21:22:21
vaschez:
Pro začátek by asi stačilo opravit ty chyby v kódu a Firefox už to bude (pravděpodobně) zobrazovat jako IE. div#hornilista {
wid th: 989px;
height: 20px;
border-bottom: 4px solid white;
margin: 0px;
padding: 0px;
}
div#hornimenu {
height: 20px;
widt h: 582px;
text-align: center;
display: block;
border-left: 7px solid white;
float: left;
margin: 0px;
padding: 0px;
}
div#hornimenu a {
display: inline-block;
width: 108px;
height: 20px;
text-align: center;
paddi ng-top: 7px;
text-decoration: none;
font-size: 11px;
text-align: center;
color: white;
}
div#hornimenu a#kuchyne {
background: rgb(153,255,51);
borde r-left: 7px solid white;
}
|
||
| vaschez Profil * |
#6 · Zasláno: 16. 1. 2011, 21:38:10
To tam mám schválně, funguje to blbě i s tím.
jinak zde odkaz: www.nabytek-homer.cz. Dala jsem tam jen nezbytný základ, snad nevadí. Myslím, že chyba je opravdu v tom, že to sveřepě centruje menu na střed. zkusila jsem si hrát s position, ale očividně blbě. |
||
| panther Profil |
#7 · Zasláno: 16. 1. 2011, 22:03:30 · Upravil/a: panther
vaschez:
„Dala jsem tam jen nezbytný základ, snad nevadí.“ pokud se závada projevuje, stačí osekaná verze. Web jako takový nás nezajímá. Příště upřesni i verzi IE - osmička se chová jako FF. Problém je v položkách menu a odkazech. na 103. řádku nahraď display: inline za float: left - položky je lépe floatovat, mají-li být vedle sebe (stejně tak ul {display: inline} - deklarovat blokové jako řádkové nebývá potřeba, většinou to je za účelem srovnání na řádek -> float)
na 113. řádku nahraď display: inline-block za display: block
k odkazům přidej i line-height: 20px, pokud v nich chceš text centrovat vertikálně
zvěřiňák: tyto chyby prohlížeče ignorují, takové vlastnosti neznají. Dělá se to poměrně normálně během debugování, že se jednotlivé vlastnosti rozbíjejí (je to snazší, než jí dávat do komentáře a smazání není vhodné z důvodu navrácení do stylopisu). |
||
| vaschez Profil * |
#8 · Zasláno: 16. 1. 2011, 22:56:19
Moc děkuju, báječně jste to vychytal.
|
||
|
Časová prodleva: 13 let
|
|||
0