internet explorer 6 box model problem

sorry to bother you all with a box model issue for my first post, but i just can't figure this one out.

basically i want my 'leftside' and 'contentwide' divs lined up beside each other, within the 'wrap' div - 'leftside' on the left, 'contentwide' on the right. in IE 6 (the only version of IE i've tested it on), 'leftside' is fine, but 'contentwide' gets pushed down so that it's top is in line with the bottom of 'leftside'.

i've removed irrelevant code such as colours and background images - im pretty sure that doesn't affect the issue.

any help is greatly appreciated!

css:

#wrap {
margin:0 auto;
padding:0;
width:760px;
margin-bottom: 20px;
margin-top: 20px;
}

#header {
height:105px;
margin:0;
padding: 8px 0 0 0;
}

#title {
width: 495px;
height: 19px;
padding: 0 0 0 265px;
margin: 0;
}

#contentwide {
border-bottom:1px solid #786357;
line-height:1.5em;
margin:0 0 0 255px;
padding:15px;
text-align:left;
border-top: 2px solid #786357;
}

#leftside {
top:-8px;
clear:left;
float:left;
margin-left:0;
padding:0 10px 0 15px;
width: 230px;
}

html:

<div id="header">
content
</div>

<div id="title">
content
</div>

<div id="leftside">
content
</div>

<div id="contentwide">
content
</div>

</div>

[edited by: SuzyUK at 1:34 pm (utc) on Feb. 28, 2008]
[edit reason] fixed code typos per msg ;) [/edit]

internet explorer 6 box model problem

shouldn't be too tough for anyone with experience!

carlclancy

carlclancy

carlclancy

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week