eddy1Medlem sedan aug. 2001969 inlägg Hej
jag vill ha tre kolumner och den i mitten ska ha fast mått medans högra och vänstra kolumnen får dela på övrigt utrymme..
har fått det att fungera som det ska i firefox men inte i IE..
Så här ser koden ut:
body {
display: table;
width: 100%;
height: 100%;
margin: 0;
position: relative;
border-collapse: collapse;
background-color: #E7E7E7;
}
.leftbox {
display: table-cell;
position: relative;
float: left;
width: auto;
}
.rightbox {
display: table-cell;
position: relative;
float: right;
width: auto;
}
.middlebox {
display: table-cell;
width: 800px;
background-color: White;
border-right : 1px solid Black;
border-left: 1px solid Black;
}
cayaMedlem sedan aug. 20051 448 inlägg ta bort position:relative
eddy1Medlem sedan aug. 2001969 inlägg Jag provade det men det fungerade inte...
Firefox blir kanon men i IE är det inte ens i närheten. Höjden stämmer inte och inte bredden, inte heller placeringen...
Tacksam för alla förslag?
Mvh
cayaMedlem sedan aug. 20051 448 inlägg får jag se mer kod än sådär?
har du något som bryter av floats efter de båda flytande divarna?
du har inte övervägt en omslutande div som har ungefär samma egenskap som body har nu, som sas håller samman de tre?
zcorpanMedlem sedan dec. 20042 245 inlägg IE saknar stöd för display:table.
Med detta fungerar det väl lite halvt i IE. Sidokolumnerna blir så smala som deras innehåll och mittenkolumnen blir därför inte centrerad.
body {
display: table;
width: 100%;
margin: 0;
position: relative;
border-collapse: collapse;
background-color: #E7E7E7;
}
.leftbox {
display: table-cell;
!float: left;
}
.rightbox {
display: table-cell;
!float: left;
}
.middlebox {
display: table-cell;
width: 800px;
!float:left;
background-color: White;
border-right : 1px solid Black;
border-left: 1px solid Black;
}
Det går nog få det bra i IE också om man vill...
zcorpanMedlem sedan dec. 20042 245 inlägg
caya skrev:
du har inte övervägt en omslutande div som har ungefär samma egenskap som body har nu, som sas håller samman de tre?
Vad är det för fel på <body>?
cayaMedlem sedan aug. 20051 448 inlägg jag övervägde möjligheterna och gillade att de ökades med en omslutande div.
;)
eddy1Medlem sedan aug. 2001969 inlägg Jag vet inte med mer kod, jag har inte mer, skulle vara html koden och då skrev jag bara så här..
<body>
<div class="leftbox">fsd</div>
<div class="middlebox">fsdfs</div>
<div class="rightbox">fsd</div>
</body>
</html>
Förstår nte riktigt hur du menar med detta?
har du något som bryter av floats efter de båda flytande divarna?
du har inte övervägt en omslutande div som har ungefär samma egenskap som body har nu, som sas håller samman de tre?
Zcorpan:
Provade att lägga till
!float: left;
Men det gjorde ingen skillnad, kolumnerna blir bara så höga som den mängd text som finns i och samma gäller det bredd..
Jag är väldigt novis på detta, har bara suttit och provat lite i topstyle..
Men jag provar allt, så har ni några fler ideer så?
Mvh
eddy1Medlem sedan aug. 2001969 inlägg Kom på en grej nu..
Vet inte varför jag skulle ha kolumner, jag var ju igentligen bara ute efter mitt kolumnen.
Jag gjorde en centrerad box istället :)
Ibland är man inte ens i närheten av att inte vara dum...
Problemet kvarstår ändå om några månader kanske du är ute efter 3 kolumner ;)
eddy1Medlem sedan aug. 2001969 inlägg visst kan det vara så... jag är fortfarande öppen för lösningar ideer att prova..
Fick ett nytt problem nu..
har två boxar eller container , vad det nu kallas. Dessa ligger vid sidan om varandra under dessa har jag en ny box som är lika bredd som dom två övre..
Detta blir bra i IE men i firefox hamnar den nedre boxen på dom övre kolumnerna??
Så här ser koden ut:
#topleft {
width: 98px;
height:86px;
float: left;
}
#topright {
width: 702px;
height: 86px;
background-image: url(../images/bg_top.jpg);
background-position: top;
background-repeat: no-repeat;
float: right;
}
#top_bord {
height: 19px;
width: 800px;
background-image: url(../images/top_bord.jpg);
background-repeat: no-repeat;
float: none;
}
och html koden
<div id="centrering">
<div id="topleft" align="center"><img src="images/smalllogo.gif"></div><div id="topright"></div>
<div id="top_bord"></div>
</div>
kaxigtMedlem sedan okt. 2004636 inlägg #top_bord {
[red]clear:both;[/red]
height: 19px;
width: 800px;
background-image: url(../images/top_bord.jpg);
background-repeat: no-repeat;
}
Om det nu är denna som ska ligga under de andra två boxarna.
zcorpanMedlem sedan dec. 20042 245 inlägg Först och främst vill du nog ha en bra doctype så du inte testar i quirks mode...
