webForumDet fria alternativet

Css-layout, IE vs. Mozilla-problem (som vanligt)

6 svar · 280 visningar · startad av Troxy

TroxyMedlem sedan mars 20041 505 inlägg
#1

Titta här:
http://www.troxy.net/layout.html

Ni som använder IE (eller Opera för den delen) kommer se att allt innehåll får grå bakgrund, som jag vill, men i Mozilla färgar inte det gråa området hela sidinnehållet.

Anledningen till detta tror jag är att Mozilla verkar behöva en fast höjd på element för att det ska räknas som att de tar plats och fyller ut. Men jag kan inte sätta fast höjd eftersom mängden text hela tiden varierar.

Hur ska jag lösa detta?

zcorpanMedlem sedan dec. 20042 245 inlägg
#2

flytande element tas bort från dokumentflödet så #frame är lika hög som #header. Mozilla gör rätt alltså.

Du skulle kunna låta #content vara statisk.

<edit reason="off-topic">
BTW, jag tror du är den första jag sett som kommer med ett CSS-problem utan att använda en XHTML doctype... :P Det är rätt, semantisk HTML är viktigare än att hoppa på det här med XHTML, IMHO :)
</edit>

TroxyMedlem sedan mars 20041 505 inlägg
#3

zcorpan, okej, då förstår jag. Men vad var det där om statisk nu igen...är för trött.

zcorpanMedlem sedan dec. 20042 245 inlägg
#4

Om du låter bli att positionera ett element så är det statiskt. Ta bort floaten alltså.

TroxyMedlem sedan mars 20041 505 inlägg
#5

Hm, men float: left gör ju att det blir två kollumner. Hur ska jag fixa det?

PepeJeriaMedlem sedan feb. 2003774 inlägg
#6

Mozilla gör rätt här, det som händer är att en float inte upptar någon plats i dokumentet, därav att din yttersta div med bakgrundsfärg inte är lika hög som floaten är. Detta är en bugg i IE, och Opera härmar de flesta IE buggar för kompabilitet.

Om du sätter en border på #frame div:en förstår du vad jag menar.

Enklaste sättet att fixa detta för riktiga browser är att lägga till ännu en div innan du stänger #frame div:en

<div style="clear:both;"></div>

Men det finns även elegantare lösningar där man inte behöver lägga till element i html:en. Detta genom att använda sig av css2. Du finner här en artikel som förklarar detta grundligt.

TroxyMedlem sedan mars 20041 505 inlägg
#7

Okej, tack så mycket.

133 ms totalt · 3 externa anrop · v20260731065814-full.3ab8d573
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
131 ms — hämta tråd, inlägg och bilagor (db)