Solved

Float clearing issues - looks good in newer standards-compliant - broke in IE 6

Posted on 2008-06-17
3
193 Views
Last Modified: 2013-12-08
I still have much to learn with CSS, so please speak slowly if you can help me.

I have a site that looks gorgeous on IE 7, Safari, Firefox, etc. - Most of the newer browsers. But in IE 6 something bizarre happens with the clearing of the right side <div>.

Site is located here: http://www.devaultquigley.com/ac

I have absolutely come to the end of my wits with this one. I simply don't know enough about CSS to figure out what of the million bugs has popped up this time. I'm trying. I'm trying reeeaal hard to not use my clunky old table layouts. Why do you have to do  this to us, Microsoft?

Can anyone help me? Thanks!
comparison.jpg
0
Comment
Question by:eric_quigley
  • 2
3 Comments
 
LVL 4

Expert Comment

by:sajay_j
ID: 21808921
Yes It looks beautiful in all browsers except ie6.

Please fill this lines in css sheet;

.twoColFixLtHdr

{

float: left;

width: 497px;

padding-top: 0pt;

padding-left: 11px;

padding-bottom: 0pt;

padding-right: 0pt;

margin-top: 0pt;

margin-right: 0pt;

margin-bottom: 0pt;

margin-left: 0pt;

}

and add this class to a div closing left side.... Hope you understood.

The div should cover image and the text block at its bottom of left side if you understand it clearly...

Check it. Regards
Sajay
0
 
LVL 4

Accepted Solution

by:
sajay_j earned 300 total points
ID: 21809929
<div class="twoColFixLtHdr"> <img image of teens> <div class="homePageCopy" style="float:left;"> block of text beneath it </div> </div>
0
 
LVL 42

Assisted Solution

by:David S.
David S. earned 200 total points
ID: 21809962
Removing the zoom declaration on ".twoColFixRtHdr #mainContent" might solve this.

Alternatively, you could replace your rule for it in the main stylesheet with this one:

.twoColFixRtHdr #mainContent {
  width: 480px;
  margin: 0 0 0 13px;
  padding: 0;
  float: left;
  display: inline; /* IE6 doubled float-margin fix */
}

By the way, [X]HTML comments (including IE's conditional comments) and elements should not be in a stylesheet.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

So you have coded your own WordPress plugin and now you want to allow users to upload images to a folder in the plugin folder rather than the default media location? Follow along and this article will show you how to do just that!
Styling your websites can become very complex. Here I'll show how SASS can help you better organize, maintain and reuse your CSS code.
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…
In this tutorial viewers will learn how to style different bullet points for unordered lists in CSS. Begin with a normal unordered list; the default bullet point is a solid circle: In the CSS, create a defined class of unordered list by typing "ul.S…

863 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

20 Experts available now in Live!

Get 1:1 Help Now