Shulou(Shulou.com)06/01 Report--

This article mainly shows you "what are the common problems in web layout in CSS", the content is simple and clear, and I hope it can help you solve your doubts. Let the editor lead you to study and learn what are the common problems in web layout in CSS.

First, if in doubt, verify it first.

When debugging, validating your code first can often save you a lot of trouble. Malformed XHTML/CSS can lead to many layout errors.

Before testing in other browsers, write and test CSS code in the most advanced browsers, not the other way around.

If you write and test in a dilapidated browser, your code will have to rely on the poor display of that old browser, and then test it in a standard browser, and you will be frustrated to see that the display results are "abnormal". Instead, you should refine your code before trying to prepare for lower-level browsers. In this way, your code is standard from the beginning, and you don't have to bother to support other browsers. Of course, the current standard-compliant browsers are undoubtedly Mozilla, Safari or Opera.

Second, make sure that the desired effect does exist.

Many browser-specific CSS extensions do not exist in formal standards. If you specify a style for a filter (filter) or scroll bar, then you use proprietary code, which has no effect in browsers other than IE. If the validator tells you that the code is not defined, it is very likely that you have used proprietary styles, which makes it difficult to achieve consistent results in different browsers.

If you must use floating objects in your layout, don't forget to use the clear property when appropriate.

Floating objects seem easy and difficult, and they don't always get what you want. If you find that the floating object protrudes the boundary of the container, or does not display as you expect, check that your expectations are correct. See Eric Meyer's tutorial on this question.

Margin merging: can be avoided with padding or border.

You may be overwhelmed by extra (or wanted but not present) white space. If you use margins, the merging of margins may be the root of the problem. Andy Budd's explanation of this may answer your doubts.

Avoid applying padding/border and fixed width to the same element at the same time.

IE5's block model is wrong, it's the one that spoils things. There is also a stopgap measure for this, but it is best to bypass this problem by specifying a padding for the parent element when the width of the child element is fixed.

Third, avoid flickering of unspecified style content under IE.

If you only rely on @ imp

Ort to enter external stylesheets, sooner or later you will find that IE has a "flashing" problem. Unformatted HTML text appears briefly before the CSS style is applied. This can be avoided.

Don't expect min-width to be useful in IE.

IE doesn't support it, but it treats width as a min-width, so the same final effect can be achieved through some of IE's filtering techniques (filtering).

Use CSS filter (filters) as a last resort

CSS techniques and filters allow you to selectively apply to (or not to) certain elements. You should try to find standard cross-browser solutions to achieve the results you want, rather than using filters all the time. Use it as a way to save lives when there is no way out. You can find a lot of CSS filtering techniques here. Don't confuse the filters here with the filter in IE. Because browsers have varying levels of support for CSS standards, people have found a lot of tricks to block out stylesheets or rules that browsers can't interpret or misinterpret. This is called a CSS filter or technique. Webjx.com

If you use anchor points, be especially careful when applying hyperlink styles.

If you use the traditional anchor point () in your code, you'll notice that the hover and: active pseudo classes also work on it. To avoid this situation, you can use id or use the little-known syntax:: link:hover,: link:active

These are all the contents of this article entitled "what are the common questions about web layout in CSS?" Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.