Div+css make Web pages easy to make mistakes summary _ experience Exchange

Source: Internet
Author: User
Tags closing tag
1. Check the HTML element for spelling errors and forgetting the closing tag.
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. The 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:
  • Related Article

    Contact Us

    The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

    If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

    A Free Trial That Lets You Build Big!

    Start building with 50+ products and up to 12 months usage for Elastic Compute Service

    • Sales Support

      1 on 1 presale consultation

    • After-Sales Support

      24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.