In the next, summed up a few HTML coding elements, hope to guide you:
1. The size of the text itself is incompatible. The same is font-size:14px of the song text, in different browsers occupy the space is not the same, ie under the actual occupation of 16px, under the white 3px,ff under the actual account for the high 17px, white 1px left, under the white 3px,opera under the more different. Solution: Set line-height for text. Make sure that all text has a default line-height value. This is important and we cannot tolerate 1px differences in height.
2.FF container height limit, that is, the container defines the height, the shape of the container frame is determined, will not be supported by the content, and IE under the content will be propped up, height limit failure. So do not easily define height for the container.
3. Also discusses the content of bursting containers, horizontally. If the float container does not have a defined width, the content under FF will be as open as possible, IE will give priority to content folding. Therefore, the content may burst the floating container needs to define the width.
Small experiment: Interested people can look at this experiment. Test the following code separately under different browsers.
A.<div style= "border:1px solid red;height:10px" ></div> b.<div style= "border:1px solid red;width:10px" ></div>
C.<div style= "border:1px solid red;float:left" ></div> d.<div style= "border:1px solid Red;overflow: Hidden "></div>
The above code in different browsers is not the same, the experiment originated from the use of small height value Div, <div style= "Height:10px;overflow:hidden" ></DIV>, small height Values should be used in conjunction with Overflow:hidden. The experiment is interesting just, want to explain, the browser to the container boundary explanation is very different, the container content influence result is different.
4. Floating removal, FF does not clear the float is not possible.
Correct everyone a misunderstanding, encountered incompatible said FF Rotten is wrong, in fact more times is the strange performance of IE let us at a loss. To the following IE6 of the various misdeeds.
5. The most hated, double-margin bugs. IE6 defines margin-left or margin-right to a floating container the actual effect is twice times the value. Solution to define the display:inline for the floating container.
6.mirrormargin bug, when the outer element has a float element, the outer element, such as defining margin-top:14px, automatically generates the MARGIN-BOTTOM:14PX. Padding will also appear similar problems, are IE6 under the special products, the situation of this kind of bug is more complicated, far more than this kind of appearance condition, has not been systematically sorted out. Solution: Set the outer element border or set float.
Extension: The interpretation of the margin-bottom,padding-bottom of the container under FF and IE is sometimes inconsistent and seems to be related.
7. Devouring the phenomenon, confined to space, I will not start. Or IE6, up and down two Div, the above div settings background, but found that there is no background of the DIV also has a background, this is to devour the phenomenon. Corresponding to the above background to swallow the phenomenon, there are scrolling down the border is missing phenomenon. Solution: Use Zoom:1. This zoom seems to be specifically designed to solve the IE6 bug.
8. Notes can also produce bug~~~ "one more pig." "This is the previous summary of the use of the bug copy, IE6 this bug, we will see the page in the pig word appeared two times, the amount of repeated content due to the number of comments and changes." Solution: With "<!–[if!" Ie]> picrotate Start <! [endif]–> method to write a comment.
9.<li/> Riga float <div/> This is a typical, tricky compatibility problem, hope to cause everyone to face up to, give Li different attributes will have different interpretation effect, FF under the interpretation of a little understandable, IE6 under the interpretation will let you not touch the mind, Due to the complexity of the issue, a separate article will be devoted to the issue. In the "experience of the use of UL" in the article has related results, but did not give a solution to the problem process.
10. Using the "Float:left;display:inline" of the strange performance of the UL. Can see this CSS is for IE6 under the double margin bug and add display:inline, this is also my CSS system in an important link, in the "UL use experience" a article has related elaboration. And this CSS used in the UL will make you miserable. No point, here can not say more ha.
Current 1/2 page
12 Next read the full text
