--- title: "CSS: kolumnproblem" type: "forum-thread" url: "https://www.webforum.nu/amne/html-css/166560-css-kolumnproblem" topic: "HTML & CSS" topic_url: "https://www.webforum.nu/amne/html-css" author: "kristoffer" published: "2007-11-20T23:10:45.000Z" updated: "2007-11-25T06:33:27.000Z" replies: 3 views: 580 page: 1 pages: 1 language: "sv-SE" site: "webForum — webforum.nu" rights: "Upphovsrätten till varje inlägg tillhör dess författare." attribution: "Citera som: webForum, https://www.webforum.nu/amne/html-css/166560-css-kolumnproblem" --- # CSS: kolumnproblem ## #1 — kristoffer, 2007-11-20T23:10Z Min CSS-baserade layout blir inte rätt. Kan någon se vad jag behöver göra för att det skall se ut som i bifogad fil. Det blir inte bara fel, det blir dessutom olika i IE och Firefox. Jag får inte rätt på det här med float och clear. ```
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
innerContent
innerTopDiv
innerMiddleLeftDiv
innerMiddleRightDiv
innerBottomDiv
``` ``` body { background-color: gray; } #wrapper { background-color: #FFF; width: 799px; margin: 0 auto; } #content { background-color: #FFF; } #rightDiv1 { float: right; background-color: Blue; } #rightDiv2 { clear: right; float: right; background-color: Brown; } #innerContent { width: 610px; } #innerTopDiv { width: 330px; } #innerMiddleLeftDiv { float: left; background-color: Orange; } #innerMiddleRightDiv { float: right; background-color: Magenta; } #innerBottomDiv { clear:both; background-color: Green; } ``` Bilagor: - [ScreenShot028.png](https://www.webforum.nu/a/16456.png) Permalänk: https://www.webforum.nu/p/166560 ## #2 — voigtann1, 2007-11-21T07:01Z ```
innerTopDiv
innerMiddleLeftDiv
innerMiddleRightDiv
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv1
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
rightDiv2
innerBottomDiv
``` Om du vill placera innerBottomDiv så måste du veta lite om dina höger kolummer med.. däför placera man den längst ner... ``` body { background-color: gray; } #wrapper { background-color: #FFF; width: 799px; margin: 0 auto; } #content { background-color: #FFF; } #rightDiv1 { float: right; background-color: Blue; } #rightDiv2 { clear: right; float: right; background-color: Brown; } #innerContent { width: 610px; } #innerTopDiv { width: 330px; } #innerMiddleLeftDiv { float: left; width:372px; background-color: Orange; } #innerMiddleRightDiv { float:left; width:372px; background-color: Magenta; } #innerBottomDiv { clear:both; background-color: Green; } ``` Permalänk: https://www.webforum.nu/p/2052882 ## #3 — kristoffer, 2007-11-22T19:40Z Tack för svaret. Men jag har fortfarande problem. I IE7 blir det rätt. Men i Firefox blir det fel. Se bifogade bilder. Vad skall jag göra för att Firefox skall se ut som IE? Tack på förhand för hjälpen. ```
top
right1
right1
right1
right1
right1
right1
right1
right1
right1
right1
right1
right1
right2
right2
right2
right2
right2
right2
right2
right2
right2
right2
right2
right2
right2
right2
innerTop
innerLeft
innerRight
innerBottom
``` ``` body { background: #9CF; } #wrapper { background-color: #FFF; width: 799px; margin: 0 auto; } #top { background-color: Olive; } #right1 { float: right; width: 176px; background-color: Red; } #right2 { width: 176px; clear: right; float: right; background-color: Green; } #innerTop { background-color: lightblue; } #innerLeft { float: left; width: 310px; background-color: #E5ECF9; } #innerRight { float: left; width: 250px; background-color: cyan; margin-left: 40px; } #innerBottom { width: 600px; float: left; background-color: Yellow; } #footer { clear: both; background-color: Orange; } ``` Bilagor: - [ie7.jpg](https://www.webforum.nu/a/16475.jpg) - [firefox.jpg](https://www.webforum.nu/a/16476.jpg) Permalänk: https://www.webforum.nu/p/2053251 ## #4 — Fuel, 2007-11-25T06:33Z prova nolla allt.. \* { margin: 0; padding: 0; } då borde det ordna sig IE & FF Permalänk: https://www.webforum.nu/p/2053796 --- Tråden på webben: https://www.webforum.nu/amne/html-css/166560-css-kolumnproblem