Welcome to WebmasterWorld Guest from 54.211.17.91

Forum Moderators: not2easy

Message Too Old, No Replies

column drop problem in IE6

   
9:04 pm on Sep 14, 2007 (gmt 0)

5+ Year Member



Hello all,

I have another weird annoying problem

I have a header, 2 columns, and a footer layout
Occasionally, the right column drop, but if i refresh it will move to where it supposed to be.
And It always happen at random page, some times drop sometimes dont
It looks like it only happens on IE6, it looks OK in firefox 2, IE7, Win Safari

Anyone know how to resolve this problem?

Thank you so much

8:01 am on Sep 15, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Is this a table layout, CSS with <div> or what? In order to help, you wlil need to post relevant CSS and HTML, and do not forget to include the doctype.

Marshall

3:20 am on Sep 20, 2007 (gmt 0)

5+ Year Member



im using XHTML 1.0 STRICT
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

here is the css for the layout


* { padding: 0; margin: 0; }

body {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
background: #5eaaca;
}
#wrapper {
margin: 0 auto;
width: 775px;
}
#header {
color: #333;
width: 775px;
float: left;
height: 116px;
background: #5eaaca;
}
#leftcolumn {
clear: left;
background: #e68841;
margin: 0;
width: 230px;
float: left;
padding-top: 15px;
}
#rightcolumn {
float: right;
background: #e68841;
margin: 0;
width: 545px;
display: inline;
padding-top: 15px;
}
#footer {
width: 775px;
clear: both;
color: #333;
background: #5eaaca;
margin: 0px 0px 10px 0px;
}

and here is the order in html


<body>

<!-- Begin Wrapper -->
<div id="wrapper">

<!-- Begin Header -->
<div id="header">
</div>
<!-- End Header -->

<!-- Begin Left Column -->
<div id="leftcolumn">
</div>
<!-- End Left Column -->

<!-- Begin Right Column -->
<div id="rightcolumn">
</div>
<!-- End Right Column -->

<!-- Begin Footer -->
<div id="footer">
</div>
<!-- End Footer -->

</div>
<!-- End Wrapper -->

</body>

thank you fro any help

9:44 am on Sep 20, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



First of all, if you are not using any xml, do not use XHTML doctype. I suggest reading this post [webmasterworld.com] about using the correct doctype.

Second, you do realize by using
* {margin:0; padding:0;}
you are eliminating the default margin and padding from everything: <body>, <div>, <table>, <p>, <ul>, and so on, and it would be necessary to assign margins and padding to each individual element. You would be better off doing:

You would be better off just doing:

body {
margin: 0;
padding: 0;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
background: #5eaaca;
}

The way your HTML is set up, there should be no need to float the header left or have a clear:left in the left column. Just put:
<br style="clear:both" /> below the header -or- better yet, put a wrapper around the left and right columns and have it clear:both. And last, I believe the display:inline in you right column is not going to serve any purpose.

Marshall

 

Featured Threads

Hot Threads This Week

Hot Threads This Month