webForumDet fria alternativet

CSS-layout förvanskas i IE6 - Hjälp!

HTML & CSS

26 svar · 1 976 visningar · startad av Reisan · sida 2 av 2

Frågan, av Reisan

Jag håller på att göra layout på en ny hemsida med CSS. Och som många andra, har jag problem att min CSS-layout förvanskas i IE6, men ser korrekt ut i FireFox för windows, samt Safari och FireFox i OSX. Ni kan se hemsidan jag håller på med på denna adress. Kan s k "Box model hack och starHTMLhack" som kan ses på denna [hemsidan](http://kaxigt.com/css/tips2.

Läs frågan i sin helhet →
Medlem sedan feb. 200732 inlägg
#21

tanten skrev:

Jag centrerade sidan också med en nästlad div :-)

Jag kollade din nästlade wrapper-divbox. Och jag fick inte det att funka. Dock provade jag en grej som jag använt innan, att sätta margin: 0 auto 0 auto; på header-diven, container-diven och bottomedge-divven. Det borde centrera dessa tre divboxarna ju... Men det funka inte så som min layout-css ser ut nu. Se nedan:

#header {
	float: left;
	height: 130px;
	width: 840px;
	margin: 0 auto 0 auto;
	background-color: #000000;
}
#container {
	background-color: #FFFFFF;
	float: left;
	width: 840px;
	margin: 0 auto 0 auto;
}
#left_content {
	float: left;
	width: 210px;
	background-color: #CCCCCC;
}
#center_content {
	float: left;
	width: 420px;
	background-color: #999999;
}
#right_content {
	float: left;
	width: 210px;
	background-color: #666666;
}
#bottom_edge {
	float: left;
	height: 10px;
	width: 840px;
	margin: 0 auto 0 auto;
}
body {
	background-color: #f6f6f6;
	background-image: url(../img/bodybg_1x768px.gif);
	background-repeat: repeat-x;
}

Min HTML ser ut så här nu:

<div id="header"></div>
<div id="container">
	<div id="left_content">   
    <dl>
    	<dt>Enoue.se</dt>
        <dd><a href="/enoue/omenoue.php">Om Enoue.se</a></dd>
        <dd><a href="/enoue/reitrulsson.php">Rei Trulsson</a></dd>
        <dd><a href="/enoue/portofolio.php">Portofolio</a></dd>
        <dd><a href="/enoue/cv.php">CV</a></dd>
        <dd><a href="/enoue/lankahit.php">Länka hit</a></d>
        <dd><a href="/enoue/webblasare.php">Webbläsare</a></dd>
        <dd><a href="/enoue/kontakt.php">Kontakt</a></dd>
    </dl>
    <dl>
    	<dt>Datorkunskap</dt>
        <dd><a href="/datorkunskap/dator.php">Dator</a></dd>
        <dd><a href="/datorkunskap/skarm.php">Skärm</a></dd>
        <dd><a href="/datorkunskap/pekdon.php">Pekdon</a></dd>
        <dd><a href="/datorkunskap/tangentbord.php">Tangentbord</a></dd>
        <dd><a href="/datorkunskap/lankahit.php">Högtalare</a>
        <dd><a href="/datorkunskap/webblasare.php">Skrivare</a></dd>
        <dd><a href="/datorkunskap/program.php">Program</a></dd>
        <dd><a href="/datorkunskap/usb-minne.php">USB-minne</a></dd>
        <dd><a href="/datorkunskap/cd-dvd.php">CD/DVD-skivor</a></dd>
        <dd><a href="/datorkunskap/datorbord.php">Datorbord</a></dd>
        <dd><a href="/datorkunskap/kontorsstol.php">Kontorsstol</a></dd>
      </dl>
  </div>
    <div id="center_content">
      <p class="header">Lorem ipsum dolor</p>
      <p class="breadtext">sit amet, consectetuer adipiscing elit. Maecenas ornare. Proin nec odio sed metus pretium lobortis. Etiam lacinia arcu ac sem. Ut lectus dolor, pharetra eget, porta sed, fringilla. </p>
    </div>
    <div id="right_content">right</div>
</div>
<div id="bottom_edge"><img src="img/bottomedge.gif" alt="" width="840" height="10" /></div>

Ni kan se http://test.enoue.se/mall.php med ovanstående kod.

Medlem sedan nov. 20051 596 inlägg
#22

float och margin auto fungerar inte ihop och eftersom du har bakgrundsfärg som ska visas så måste du ha float på container bl.a. Så enklast är att göra som jag gjort, lägga in allt i en div utan float.

Medlem sedan feb. 200732 inlägg
#23

tanten skrev:

float och margin auto fungerar inte ihop och eftersom du har bakgrundsfärg som ska visas så måste du ha float på container bl.a. Så enklast är att göra som jag gjort, lägga in allt i en div utan float.

Räcker det inte med att ta bort float i header, container och bottomedge-divarna? Du syftar på att jag ska lägga in alla divar inom en ny div som ej har float och med margin 0 auto 0 auto?

Ps. Ursäkta för trögheten. ;)

Medlem sedan nov. 20051 596 inlägg
#24

Om du gör det kommer bakgrundsfärgen t.ex försvinna i de webläsare som tolkar sidan "rätt".
Och du se till att sidan validerar nu när du jobbar med avstånd. Du har glömt ett </dd> och skrivit fel i en annan </d>

Medlem sedan feb. 200732 inlägg
#25

tanten skrev:

Om du gör det kommer bakgrundsfärgen t.ex försvinna i de webläsare som tolkar sidan "rätt".
Och du se till att sidan validerar nu när du jobbar med avstånd. Du har glömt ett </dd> och skrivit fel i en annan </d>

Ojdå, missade taggar. Fixat nu. Ok, då kör jag med en extra div som omsluter alltihopa. :) Tack än en gång och för att du har tålamod med mig. :)

Medlem sedan nov. 20051 596 inlägg
#26

Ser.... du måste ha en bredd på wrapper också, annars vet inte webläsaren vad det är som ska centreras.

Medlem sedan feb. 200732 inlägg
#27

tanten skrev:

Ser.... du måste ha en bredd på wrapper också, annars vet inte webläsaren vad det är som ska centreras.

Åh, vad pinsamt. Ja, det måste jag ju ha. Fixat. :D

261 ms totalt · 4 externa anrop · v20260731065814-full.86ec41c2
123 ms — deklarationer (db)
0 ms — hämta statistik (cache)
134 ms — hämta tråd, inlägg och bilagor (db)
123 ms — ändringar (db)