"Top" CSS Tips

Only the latest browsers are supported. That is to say, give up IE5 and IE5.5. This will save you a lot of time. For IE6, it is not necessary to use the box model hack. If it's only for popular browsers, the same effect can be achieved with very little hack.

One, within a line of the declaration of CSS

H2 {font-size:18px border:1px solid blue; color: #000; Background-color: #FFF;}
H2 {
font-size:18px;
BORDER:1PX solid blue;
Color: #000;
Background-color: #FFF;
}

The second one looks really formatted, but it doesn't help in reading. Writing in one line allows you to quickly find the part you need.

I used to write a similar second way, but gradually discovered as the article said, not much use. A line looks refreshing and saves the place and makes the file smaller.


Second, block writing code


This way the writing code can make CSS more page, in the presence of problems can be the shortest time to find the problem. Just like the following:

#content {float:left;}
#content p {...}
#sidebar {float:left;}
#sidebar p {...}
#footer {Clear:both;}
#sidebar p {...}

Third, browser compatibility issues


Only the latest browsers are supported. That is to say, give up IE5 and IE5.5. This will save you a lot of time. For IE6, it is not necessary to use the box model hack. If it's only for popular browsers, the same effect can be achieved with very little hack.

Reasonable use of CSS can avoid hack. Of course, there will be more time for debugging.

All content within the container containing the floating element should be designed to be consistent with the container. If it is too large, it will slide to the wrong position. Using negative margin to adjust outside the container can also cause slippage.

Understanding overflow If there are two floating elements in the page, outputting too much content in the left container will cause the right container to go down below. This means your margin, width or padding settings are confusing, but not in FF. Use Overflow:hidden or overflow:scroll to avoid ie allowing content to burst out of the container