FF vs IE

[aika]

kur ir tā vaina, ka IE div'us nostāda kolonnā, kad FF rāda kā vajag - rindā??!!

kods:

<div id="body">

<div id="row">

<div id="header_left"> </div>

<div id="header_center"> </div>

<div id="header_right"> </div>

<div id="clear"></div>

</div>

</div>

 

css:

#body {display: table; background-image:url(images/bg.jpg); width:100%}

#row{display: table-row; width:100%;}

#clear {clear:both;}

#header_left {display: table-cell; background-color:#090000; width:auto;}

#header_center {display: table-cell;width:800px; height:90; background-image:url(images/header_center.png);background-repeat:no-repeat; background-color:#171212;}

#header_right{display: table-cell; background-color:#090000; width:auto;}

 

Help un paldies jau iepriekš!

Edited September 3, 2011 by aika

[Morphius]

Pamēģini šādi:

 

#header_left {float: left; display: table-cell; background-color:#090000; width:auto;}

[aika]

jau mēģināju - float:left nostrādā, taču tad width:auto ne un backgrounds ir tikai īsa strīpiņa.

[codez]

Ja gribi taisīt dizainu ar tabulām, tad izmanto tabulas tagus, nevis kaut kādu display:table-blabla huiņu.

Bet vispār to, ko tu centies panākt, var normāli panākt daudz vienkāršāk un bez display:table-...

 

<div id="wrapper"></div>


#wrapper{
 width:800px;
 margin:0 auto;
}

 

 

http://jsfiddle.net/PBLEK/

Edited September 4, 2011 by codez

[aika]

biju jau uztaisījis ar tabulām - tur bija tā pati problēma - IE šrinkoja kreiso malu

tagad IE divus liek kolonnā. bet man domāt - atrisinājums ir tuvu!.

 

uzdevums ir 3 kolonnu layauts, kurā vidējā kolonna ir fixed width, malas auto.

malējās kolonnas vajadzīgas lai menedžētu background attēlus

Edited September 4, 2011 by aika

[daGrevis]

Un atkal pierādās, kāpēc pret IE ir tāds naids...

 

Kura versija Internet Explorer'am?

[aika]

8..

[aika]

ne gluži tas, bet nu izlīdzējos ar

<div 100%><div iecentrēts></div></div>

paliku bez dekorācijām ap centrālo kolonnu...

[Maris-S]

Īstenībā ir samērā daudz piemēru 3 kolonu izvietojumam, domāju caur google atradīsi, bet ieteiktu neizmantot display: table-..., tos IE neapstrādā kā vajadzētu.

 

http://www3.w3school...ass_display.asp

 

Note: The values "inline-table", "run-in", "table", "table-caption", "table-cell", "table-column", "table-column-group", "table-row", "table-row-group", and "inherit" is not supported in IE7 and earlier. IE8 requires a !DOCTYPE. IE9 supports the values.

Edited September 8, 2011 by Maris-S