Xiaocai wants to ask you a question. _html/css_WEB-ITnose

I saw on Groupon.com, Juhuasuan, and Taobao that their product displays are piece by piece, with gaps left and right, top and bottom. The total width of the entire product display is the same as the width of the title bar or navigation bar above. Same. But when I make it myself, it is always not aligned with the top one, or it is just a little bit off, or it is squeezed to the next line. I use margin-right to set the size of the gap. I would like to ask everyone if there is any better way to achieve this effect. It is best to post the code to take a look. Thank you all.

Reply to the discussion (solution)

Regarding the width control problem
Carefully calculate whether the sum of width, margin, padding and border exceeds the limited width of a line?

The correct answer is that LZ should first understand the concept of the box model before practicing it

Write a model and make it into css. Use the correct class every time and don’t repeat the work
You can also directly use the css of other people’s websites

First, let’s understand what the box model and float are. I believe that once you understand these, you will know what to do

I think so too The concept of floating is more important.

Floating properly. . . . In fact, the box model can be understood by looking at the picture
Floating and positioning... Anyway, I was confused for a long time

I wonder if you have better information to introduce it

The key to the poster is The positioning of the two on the left and right is right. Others are on the left and right and to the side. Typesetting is easiest to use table. If you use div css to simulate, in the case of fixed width, after the left floating, the right margin, then the last one on the same line should be careful to remove the right margin