I've googled around, and asked everyone I know, but I still can't find
any reference to anyone else having faced this particular IE bug with
floats.
I've put a page at http://dochawk.org/sample.html . This was made by
stripping out the google ads from the regular pages. It validates as
strict 4.01 at http://validator.w3.org. (The google ads drive it nuts!)
The main (right) column is made with alternating left and right floats
to put blocks in partway down--the google skyscraper on the left and the
picture and "ask dochawk" box on the right. This is done by alternating
floats of .1px and of the size that I want to use (I've clipped the code
in at the end).
I want the main text to wrap around these blocks, and use the same code
on most pages, simply including different body text.
On mozilla, firefox, and opera, all works well. On IE 6, howerver, the
right-hand floats are ignored and text is placed underneath them. Not
overlapping them; they're completely ignored as if they weren't there.
Apparently IE5 running under wine doesn't have this problem.
The floats I use for positioning are .1px rather than 0px aas opera and
mozilla both collapse them to zero height as well at 0px.
Is there a clean way to deal with the IE problem? Making and
conditionally including different css sheets based upon the browser not
only seems ugly, but would require moving the picture to the left of the
column (and making the page itself ugly). It also seems dangerously
close to the peek-a-boo (not the right term) pages google warns about.
While I'm at it (moving from serious problem to simple ignorance), could
the whole series of floats be put into the style sheets as a single
element to be used before specifying the content text, or would I have
define each paragraph in the style sheet and then include them all?
thanks
hawk
The code:
(starting the second column of a table):
<td valign=top>
<div style="float:right;width:0.1px;height:250px">
<!--div id="hr1"-->
</div>
<div style="float:left;width:0.1px;height:700px"></div>
<img style="float:right;clear:right;height:375px; width:217px;padding:6;
position:relative;top:6"
src="http://dochawk.org/images/hawkins.jpg"
alt='picture of Dr. Richard E. Hawkins'
/ >
<p style="float:left;clear:left;height:600px; width:160px;padding:4;
position:relative;top:6"/>
</p>
<div style="float:right;width:0.1px;height:850px"></div>
<div style="float:left;width:0.1px;height:350px"></div>
<p
style='float:right;clear:right;width:30%;padding:4 ;border-style:solid;border-width:2;'>
Have a question for dochawk? See answers at
<a href="/askdochawk.php">askdochawk</a>!
</p>
<div style="float:left;width:0.1px;height:1px"></div>
--
Richard E. Hawkins, Asst. Prof. of Economics /"\ ASCII ribbon campaign
do*****@psu.edu 111 Hiller (814) 375-4846 \ / against HTML mail
Find commentary on law, economics, and X and postings.
other issues of the day at dochawk.org! / \