Eight problems that plague beginners with CSS web page layout

CSS web page layout, difficult to say, is actually very simple. It is easy to say. There are often many problems that plague new users and many tips are introduced. These tips and knowledge can help you get twice the result with half the effort. However, in more cases, we are often troubled by small issues and cannot easily. Today I will introduce you to eight tips, which are very useful.

1. check immediately if you have any questions

If the originalCodeSimple detection can save a lot of headaches. W3C is available for both XHTML and CSS detection tools, see http://validator.w3.org. Note that errors at the beginning of the file may cause more errors due to improper structure and other factors. We recommend that you correct some of the most obvious errors and then re-check them, this may reduce the number of errors.

2. Remember to clear the command properly when using the floating Function

Floating is a dangerous function and may not produce the expected results. If you encounter floating elements extending to the border of the peripheral container or other abnormal situations, please first make sure that your approach is correct.

3. Use padding or border to avoid border duplication

You may be overwhelmed by a small amount of space, or cannot squeeze out any space you need. If you use margin, it is easy to produce a coincidence of the boundary.

4. Try to avoid specifying the padding/border and height or width for the element at the same time.

Windows ie often causes the calculation of width and height. Some methods can solve this problem, but if the parent element needs to specify the height and width, it is best to apply margin to the child element within the parent element, or when the child element needs to specify the height and width, apply the padding to the parent element to achieve the effect.

5. Do not depend on Min-width/min-height.

Windows IE does not support two syntaxes. However, to some extent, Windows Ie can achieve the effect equivalent to Min-width/min-height. Therefore, you only need to filter IE to achieve the desired result.

6. If you have any questions, first reduce the percentage

Sometimes, some errors may cause 50% + 50% to become 100.1%, causing problems on the webpage. In this case, change these values to 49% or even 49.9%.

7. Remember to write "trbl"

The abbreviated Syntax of border, margin, and padding has a specific order. The rotation starts from the top to clockwise: Top, right, bottom, left. so margin: 0 1px 3px 5px; the result is that there is no border above, 1 pixel on the right, and so on. Remember "trbl", and you will not be mistaken.

8. As long as the value is not zero, the Unit must be specified.

This requires special attention. Many new users often ignore this issue. More than one emphasizes this problem.