Problem s CSS v IE, FF a Opere

Zdravim vas.
Pred casom som si dal tu namahu /s prispenim par prvkov z roznych template/ a vyrobil som si stranku...Potialto vsetko OK. V IE sa zobrazuje korektne, ale i FF a Opere sa footer posunie vyssie a pozadie vyskoci navrch stranky - ten sedy pruzok...Problem je typicky v CSS ale neviem kde...

/*
Author :
Email :
Website :
*/
* {
border:0;
margin:0;
padding:0;
}
/* general */
a {
color:#b3000a;
text-decoration:none;
}
a:hover {
color:#555;
text-decoration:none;
}
/* body */
body {
background:#343434 url('image/background_body.jpg') 0 50% repeat-x;
color:#666;
font:0.8em "trebuchet ms", helvetica, sans-serif;
}
/* container */
#container {
background:url('image/background_container.jpg' ) no-repeat;
height:530px;
left:50%;
margin:-265p x 0 0 -380px;
position:absolute;
top:50%;
width:760px ;
}
/* navigation */
#navigation {
height:88px;
padding:32px;
width:696px;
}
#n avigation ul {
list-style:none;
}
#navigation ul li {
float:right;
height:88px;
list-style:none;
w idth:75px;
}
#navigation ul li a {
color:#fff;
display:block;
height:50px;
line -height:50px;
padding:50px 0 0;
text-align:center;
width:75px;
}
#navigation ul li a:hover {
background:url('image/navigation.jpg') repeat-x;
color:#111;
}
#navigation ul li a.active {
background:url('image/navigation.jpg') repeat-x;
}
/* content */
#content {
height:320px;
overflow:auto;
padding:0 42px;
width:676px;
}
#content h1 {
color:#333;
font-size:200%;
}
/* footer */
#footer {
color:#fff;
height:20px;
padding:22px;
text- align:right;
width:709px;
}
#footer a {
color:#fff;
}

Okrem CSS prikladam aj screeny z jednotlivych prehliadacov:
Explorer: view.php
Firefox: view.php
Opera: view.php

Ak je to nad ramec poradne, ospravedlnujem sa.

Předmět	Autor	Datum
Bez HTML je to len tipovanie. Najlepší by bol odkaz priamo na tú stránku. los 02.10.2007 22:07	los	02.10.2007 22:07
Z obrázků se nic vyčíst nedá. Co nějaký padding, margin, výška obkazu, display: block u odkazů... a… Kráťa 03.10.2007 03:06	Kráťa	03.10.2007 03:06
Oki, pridavam odkaz na stranku: www.konkristov.szm.sk nastis 03.10.2007 07:41	nastis	03.10.2007 07:41
Pridaj pravidlo do CSS: html { height: 100%; } los 03.10.2007 08:39	los	03.10.2007 08:39
Vdaka, pomohlo :beer: ...zial len na pozadie - paticka je stale posunuta o par pixelov vyssie... nastis 03.10.2007 08:46	nastis	03.10.2007 08:46
IE počíta výšku a šírku trochu inak než ostatné prehliadače. Môžeš použiť nejaký hack (napr. http://… los 03.10.2007 09:44	los	03.10.2007 09:44
Z toho clanku som pochopil, ze "matrjoska" by riesila tento problem, lenze...ako ju aplikovat v mojo… nastis 03.10.2007 10:20	nastis	03.10.2007 10:20
Zkus mrknout i tady mody-prohlizecu.html Jinak já používám podtržítkový hack .neco {border: 2px; hei… Kráťa 03.10.2007 11:11	Kráťa	03.10.2007 11:11
Bůůů já tam žádnou patičku nevidím, jen reklamu... Kráťa 03.10.2007 11:15	Kráťa	03.10.2007 11:15
Mozno som sa zle vyjadril ale v CSS je to vedene ako "footer" toto som myslel: Designed for IE6 by k… nastis 03.10.2007 11:22	nastis	03.10.2007 11:22
Stejně nevím, k čemu je tam ona informace, že valid super. Ještě ke všemu, když to valid ani není ht… Kráťa 03.10.2007 11:33	Kráťa	03.10.2007 11:33
Oki, to vyhodim - su to pozostatky template, ale Designed by konkristov Copyright 2007 by som tam ra… nastis 03.10.2007 12:04	nastis	03.10.2007 12:04
Upravene...Ale stale problem s posunutim v Opere a FF. Stavim sa, ze to robim niekde zle...ako by ma… nastis 03.10.2007 13:07	nastis	03.10.2007 13:07
Nestuduji to, a pospíchám, takže pouze příklad: #footer { color:#fff; height:20px;_height: 16px; pa… Kráťa 03.10.2007 13:59	Kráťa	03.10.2007 13:59
Zial, ani toto nezabera...netusil som ze jeden riadok textu moze taketo problemy robit - az mam chut… nastis 03.10.2007 17:08	nastis	03.10.2007 17:08
Nepsal jsem ti, že je to řešení, ale příklad. Když jsem se na to teď podíval, trklo mne, že by to mo… Kráťa 03.10.2007 17:35	Kráťa	03.10.2007 17:35
Nechacem pisat, ze si genius, ale, sakra, pomohol si mi! DAKUJEM. Bola to tretia moznost... nastis 03.10.2007 17:55	nastis	03.10.2007 17:55
nz rss Žádný borec nejsem, ale už jsem pár webíků udělal a tohle mě hned trefilo do oka, když jsem s… poslední Kráťa 03.10.2007 18:34	Kráťa	03.10.2007 18:34

Bez HTML je to len tipovanie. Najlepší by bol odkaz priamo na tú stránku.

Z obrázků se nic vyčíst nedá. Co nějaký padding, margin, výška obkazu, display: block u odkazů... a dalších 42 vecí?

Oki, pridavam odkaz na stranku:
www.konkristov.szm.sk

Pridaj pravidlo do CSS:

html { height: 100%; }

Vdaka, pomohlo ...zial len na pozadie - paticka je stale posunuta o par pixelov vyssie...

IE počíta výšku a šírku trochu inak než ostatné prehliadače. Môžeš použiť nejaký hack (napr. http://www.pixy.cz/pixylophone/2003_08_archiv.html# 1061885333).

Z toho clanku som pochopil, ze "matrjoska" by riesila tento problem, lenze...ako ju aplikovat v mojom pripade? No co, som zaciatocnik a sam si nepomozem - pomozete vy?

Zkus mrknout i tady
mody-prohlizecu.html
Jinak já používám podtržítkový hack
.neco {border: 2px; height: 20px; _height: 18px}
sice to není úplně košer, ale je to jednoduché.

Bůůů já tam žádnou patičku nevidím, jen reklamu...

Mozno som sa zle vyjadril ale v CSS je to vedene ako "footer"
toto som myslel: Designed for IE6 by konkristov Copyright © 2007 | Valid CSS & XHTML

Stejně nevím, k čemu je tam ona informace, že valid super.
Ještě ke všemu, když to valid ani není
http://validator.w3.org/check?uri=http://www.konkri stov.szm.sk/
Co tam dát místo nápisu obrázek?

[validpig.gif]

Upravene...Ale stale problem s posunutim v Opere a FF. Stavim sa, ze to robim niekde zle...ako by mal vyzerat v mojom pripade hack?

#footer {
color:#fff;
height:20px;
padding:22px;
text- align:right;
width:709px;
}

Nestuduji to, a pospíchám, takže pouze příklad:

#footer {
color:#fff;
height:20px;_height: 16px;
padding:22px;
text- align:right;
width:709px;
}

Ale možná to chce výšku u něčeho jiného. Např u elementu, ve kterém to je a je orámován.

Zial, ani toto nezabera...netusil som ze jeden riadok textu moze taketo problemy robit - az mam chute ho vymazat (taketo riesenia sa mi ale velmi napozdavaju)

Nepsal jsem ti, že je to řešení, ale příklad. Když jsem se na to teď podíval, trklo mne, že by to mohl dělat padding. Buď jej tedy zmenšit, nebo jej nadefinovat pro všechny strany, nebo s hackem... Chce to zkoušet a třeba si s tím hodinu pohrát. Zkusil bych jej zmenšit:

/* footer */
#footer {
color:#fff;
height:20px;
padding:11px;
text-align:right;
width:709px;
}

nebo pro všechny strany třeba:

/* footer */
#footer {
color:#fff;
height:20px;
padding:5px 22px 5px 0; /*horni pravy dolni levy*/
text- align:right;
width:709px;
}
#footer a {
color:#fff;
}

a s podtržítkovým

/* footer */
#footer {
color:#fff;
height:20px;
padding:11px;_padding: 22px; /*nebo obracene?*/
text- align:right;
width:709px;
}
#footer a {
color:#fff;
}

Nechacem pisat, ze si genius, ale, sakra, pomohol si mi! DAKUJEM. Bola to tretia moznost...

nz rss
Žádný borec nejsem, ale už jsem pár webíků udělal a tohle mě hned trefilo do oka, když jsem se tedy tu otravnou reklamu rozhodl zavřít, abych to viděl.
Co dát před </body> několik , aby tam alespoň vznikl posuvník?

</body>

Zpět do poradny Odpovědět na původní otázku Nahoru