CSS Common Problems Solution Summary _ Experience Exchange

1. Check HTML elements for spelling errors, forgetting to end tags
Even a veteran often makes a mistake about the nesting of Div's relationships. You can use the Dreamweaver validation feature to check for errors.

2. Check that the CSS is correct
Check to see if there are any spelling errors, forgetting the end of the}, and so on. You can use CLEANCSS to check for spelling errors in your CSS. CLEANCSS is a tool for the CSS to lose weight, but can also check spelling errors.

3. Determine where the error occurred
If the error affects the overall layout, you can delete the DIV block one at a-until you delete a DIV block and the display returns to normal to determine where the error occurred.

4. Use the Border property to determine the layout characteristics of an error element
Using the Float property layout is an error when you accidentally make a mistake. The element boundary is determined by adding the border attribute to the element, which causes the error to be known.

5. The parent element of the float element cannot specify the clear property
Macie if the clear property is used on the parent element of the float element, the layout of the float elements around it is confusing. This is Macie's famous bug, if you do not know it will be a detour.

6. Float element Be sure to specify the Width property
Many browsers have bugs when displaying a float element that does not have a width specified. So regardless of the contents of the float element, be sure to specify the width property for it.
When specifying an element, use EM instead of PX as a unit.

7. Float element cannot specify attributes such as margin and padding
IE has a bug when displaying float elements that specify margin and padding. Therefore, do not specify the margin and padding properties on the float element (you can nest a div inside a float element to set margin and padding). You can also use the Hack method to specify special values for IE.

8. The sum of the width of the float element is less than 100%
If the width of the float element is exactly 100%, some old browsers will not display properly. So make sure the sum of the widths is less than 99%.

9. Do you want to reset the default style?
Some properties, such as margin, padding, and so on, can be interpreted differently by different browsers. Therefore, it is best to first set all the margin, padding to 0, the list style to none, etc. before development.

10. Have you forgotten to write a DTD?
If no matter how to adjust the display results of different browsers or not the same, then you can check the beginning of the page is not forget to write the following line of the DTD:

