9 Frequently asked questions in CSS div layouts

First, the UL margin problem
UL inside margin and padding default value is not 0, so when nesting Li, if the value of the specified Li, may be the external div braces, so if you want to use the time to specify the UL margin and padding for 0, the following ul{margin:0px; padding:0px;}

Second, the problem of picture setup
Now many websites try to put the background picture on a picture and then use Background-postion to get the background picture, this greatly reduces the size of the picture also optimizes the opening speed of the site, and some pictures in different browsers in the value is also different, For example, the height of the picture in the IE6 is not very accurate, so you should set img{Display:block}. The best picture format should be GIF.

The question of float alignment
When we set up float alignment, we tend to have the next line of Div squeeze to the top line of the parallel crowded now this is because in the set float float should be cleared two times of content, add the following code in the style Clear:both can be.

Iv. Definition of ID and class
The style defined relative to the ID can only be called once in the page, so when we define the style, if you want to be called multiple times, use class, when using JS, it's best not to use the ID to define the style and JS ID conflict.

V. Issues of bilateral distances
The outer margin of a floating element doubles, but the outer margin of the other floating elements adjacent to the first floating element is not doubled. Workaround: Add style display:inline to this floating element;

Six, the gap produced by the picture
The parent element directly contains the , and the bottom of the picture creates a gap with the edge of the parent element.
Solution Method:
1. Make </div> and on the same line in the source code, because the gap is generated by a newline character.
2. Give add style display:block;

Seven, block element minimum height problem
The minimum height of the block element is 10px, and is 10px when the height definition is less than 10px; Workaround: Add style overflow:hidden for this block element; Or make the font size of this block element equal to the height of this element.

Eight, floating li behind the elements of line-wrapping problem
If Li is floating in the list, the elements behind the list cannot be wrapped. Solution: For this UL definition appropriate high or to include this UL parent div definition appropriate high.

On the upper and lower bounds of the sub-elements
When the parent element does not have a height defined, the upper and lower bounds of the child element are superimposed on the upper and lower bounds of the parent element, and are displayed outside the parent element. Workaround: Define the inner margin or border for the parent element.