Common CSS skills and troubleshooting

1. solve the problem that the background cannot be extended
<Div id = "content"> <Div id = "Main"> <Div id = "maincol"> </div> <Div id = "xcol"> </div> </div> <Div id = "subcol"> </div>

<Style type = "text/CSS">
<! --
# Content {width: 700px; Background: URL (img/bg.png) Repeat-y ;}# subcol {float: Left; width: 200px ;}# main {width: 500px; float: Right ;}# maincol {width: 300px; float: Left ;}# xcol {width: 200px; float: Right ;}
-->
</Style>

The above problem shows that the adaptive height of the background does not inherit the float height. solution:
Add <Div style = "clear: Both;"> </div>

2. How to align webpages in the center?
Body {margin: 0; padding: 0; text-align: center ;}
# Container {width: 760px; margin: 0 auto; text-align: Left; position: relative ;}

Note: The body sets the margin and padding to 0, so that the body content is in close contact with the browser edge. Then text-align: center centers all the body content, including # container. The first 0 in the margin of the iner is upper and lower, and the second auto is left and right. The upper and lower values are about 0 to allow automatic control. In addition, positioning is relative. Only the elements positioned as relative can be moved!

3. Use CSS to create a mouse Image
When the network speed is not fast with the "mouse over the image" in DW (dreamweav), the image after the mouse has not been downloaded yet. The phenomenon of white images looks very bad. In fact, CSS can solve this problem. It is very simple and fast to download, so there will be no download of images after the mouse is passed.

4. Principles and skills of using ID and class in Structure
Usage principles of ID and class
It is said that W3C sets the ID and class to be unique and the class is universal. ID must be unique and should be used in the periphery whenever possible. The class is reproducible and should be used within the structure as much as possible.
Tips for using ID and class
A. The child-level naming contains the part of the parent name starting. This makes it easy to clarify the hierarchy when writing CSS.
B. It is best not to use ID in the sublevel of class. Of course, special circumstances are special.
C. Class names should be case-insensitive. For example, newmovie is the most suitable method to use the explicit relationship with the first statement. Note that browsers other than IE are very case sensitive. Also, it must start with a letter.

From: http://www.uxteam.com/myblog/article.asp? Id = 227