Memo, gap problem between Div

During the PSD to Div + CSS process in the past two days, it was found that the IE browser had a strange problem, and there was a 3px gap between the two adjacent Divs, the specific description is as follows:

The above Div: contains an image.

The following Div: the background is used, and the vertical axis is repeated.

Details:

 

After Google, the solution is to find the position of the image code in the above Div and set the attribute style = "display: Block" for it. The problem is solved.

 

 

Display: block indicates that the object is a block-level element (such as a and span ).

 

General Block-level elements such as paragraph <p>, title

 

A notable feature of block-level element-free is that each block-level element is displayed from a new line, and the subsequent element-level element must be displayed in another line.

 

 

The text in the CSS authoritative guide shows that any visible element that is not a block-level element is an inline element. Its performance is in the form of "Row layout", where "Row layout" means that its performance is always displayed in rows. For example, when we set an inline element border-bottom: 1px solid #000, it is represented by repeating each line, and there will be a black fine line under each line. If it is a block-level element, the displayed black line will only appear below the block.

 

For example, the following code shows the differences between the inline element IMG and the block-level element Div:

        <p></p>         

The effects of the above Code are as follows: