7 tricks for CSS style layout

When using CSS to build a website, you must have encountered various layout problems and may be overwhelmed. The purpose of this article is to make your design process easier and provide you with quick reference when you encounter difficulties.
1. Verify if you have any questions.
When debugging, first verifying your code can save a lot of trouble. Incorrect XHTML/CSS format may cause many layout errors. Before testing in other browsers, write and test CSS code in the most advanced browsers, instead of the opposite.
If you write and test your code in a worn-out browser, you have to rely on the poor display of the worn-out browser and then test it in a compliant browser, you will be frustrated when you see that the result is "abnormal. Instead, you should first improve your code, and then try to plan for a lower-level browser. In this way, your code is compliant with the standard from the very beginning, and you do not have to worry about supporting other browsers. Of course, the browsers that currently comply with the standards are definitely Mozilla, Safari or Opera.
2. Make sure the effect you want exists.
Many specific browser-specific CSS extensions do not exist in official standards.
If you specify a style for the filter or scroll bar, you use private code, except for IE, which is useless in other browsers. If the validators tell you that the code is not defined, it is very likely that you use a private style and do not expect consistent results in different browsers.
3. If you must use floating objects in the layout, do not forget to use the clear attribute in due time.
Floating elements seem to be easy to implement and difficult to control. If you find that the floating object extends the container boundary or is not displayed as expected, check whether your expectation is correct. For more information, see Eric Meyer's tutorial.
4. padding merge: padding or border can be used to avoid padding merging.
You may be overwhelmed by unnecessary (or unwanted) spaces. If you use margins, margin merging may be the root cause of the problem.
Andy Budd may explain this to you.
5. Avoid applying padding/border and fixed width to the same element at the same time.
The block model with incorrect IE5 is the culprit, because it makes things messy. Although there is a remedy, it is best to bypass this problem. When the width of the child element is fixed, specify the padding for its parent element.
6. Avoid flickering of unspecified style content in IE
If you use @ import to enter an external style sheet, you may find that IE is "blinking. Before applying the CSS style, unformatted HTML text will appear for a short time. This can be avoided.
7. Do not expect min-width to be useful in IE.
IE does not support it, but it treats width as min-width. Therefore, some IE filtering techniques can achieve the same final effect.