I found a solution, but it is not very elegant.
First I updated the css by changing the margin declaration for the
<article> element. Second I added a class of .left and applied it in the
HTML to the two <article> elements I wanted to place well ... on the left.
Here is the .css snippet :
article {
height: auto;
/* for IE */
width: 45%;
background:#ddd;
color:#5e7497;
float:left;
/* changed from margin:0 18px 24px 0; */
margin-bottom:24px;
padding:15px 15px 65px;
border:#abb9d8 1px solid;
}
/* added class to every other <article> element and gave them a right margin
*/
.left {
margin-right:24px;
}
and a link to a page which behaves in IE6. The .css linked below is
unchanged except from the lines above.
http://bit.ly/IE6fixed
I arrived at the solution mostly through trial and error and am not 100%
clear on what was wrong to begin with and how switching the margin
declarations fixed it.
If anyone cares to enlighten me, it would be appreciated :-)
/ Tony
On Wed, Oct 20, 2010 at 10:27 AM, Anthony L <[email protected]> wrote:
> Hi,
>
> I am having a problem with a floated element in IE6. Big surprise :o)
>
> I have read many posts here as well as many of articles on the subject,
> including this very recent one: http://bit.ly/clrfxReloaded , and have
> tried , in vain, to apply what I thought I learned to my problem.
>
> The page in question is here:
> http://dl.dropbox.com/u/2488267/untitled%20folder/Toolbox_template_15_Oct_2010.html
>
> The code for the floated element in the IE specific css is :
>
> article {
> height: auto;
> /* for IE */
> width: 45%;
> background:#ddd;
> color:#5e7497;
> float:left;
> margin:0 18px 22px 0;
> padding:15px 15px 65px;
> border:#abb9d8 1px solid;
> }
>
> No other elements on the page are floated.
>
> In IE the first two boxes "Overview" and "Links" appear as expected. In the
> second row however, the float somehow breaks and pushes the "faq" box down
> and shifts the "templates" box to the right.
>
> Oddly enough, adding additional text to the "Links" box fixes the float
> position of the two boxes ... "faq" and "templates".
>
> Any hints or tips would be greatly appreciated.
>
> For good measure the full IE specific .css is here:
> http://dl.dropbox.com/u/2488267/untitled%20folder/toolboxIE.css
>
> Thanks in advance,
> Tony
>
______________________________________________________________________
css-discuss [[email protected]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
