See a CSS Tutorial example:
xml/html code
code is as follows |
copy code |
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd <meta http-equiv= "Content-type" Content= "text/html; Charset=gb2312″/> <title> One more pig </title> <body> <div style= " width:400px "" <div style= "Float:left" ></DIV> <!–_–> <div style= "float:right; width:400px ">↓ This is the pig that came out </div> </div> </body> |
With a IE6 look, you will find that there will be more than a "pig"!
The cause of the problem and how to fix it:
Reason:
The text overflow caused by the annotation, belongs to the IE6 bug, the number of words that overflow the text = *2-1 of the annotation, the words here are set up in Chinese or English numerals. Note there is a certain connection between the position and the overflow position, the floating of the block and the fixed width of the text block.
Solution:
1, do not place comments. The simplest and quickest way to solve the problem;
2, note do not place in the 2 floating blocks between;
3, the text block included in the new <div></div> between, such as: <div style= "float:right;width:400px" ><div>↓ This is the more out of the pig </ div></div>;
4, remove the fixed width of the text block, and 3 have similarities;
5. Add a <br/> or space in the back; (not recommended)
6, use IE annotation format, such as: <!–[if! Ie]>put your commentary in here...<! [endif]–>
7. Add position:relative to box; attribute