.layout
{
width: 760px;
margin: 150px auto 0 auto;
}
.layout2
{
width: 250px;
display: inline-block;
}
<p class="layout">
<p class="layout2">
1
</p>
<p class="layout2">
2
</p>
<p class="layout2">
3
</p>
</p>
請問如何讓layout2 p能夠置中對齊呀?
另外
若是layout改成750寬
layout2設250寬
第三個p會跑到下面去....
Code pasted:
Set the parent element as above
font-size:0
The prerequisite is that you must set the font-size of the child element, that is,inline-block
and set the font, otherwise nothing will be displayedReference: http://sentsin.com/web/23.html
has spaces, set font-size:0
in the parent elementThe inline-block has spacing and needs to be removed
See this article
http://www.zhangxinxu.com/wor...
What does layout2 center alignment mean?
Let me add something. In fact, there is no need to set font-size:0;
You can write it like this.
The space between inline-block element tags causes gaps between inline-blocks.
Or write like this, filling in your formatting with comments.
This way there is no need to add additional styles, after all the comments will be compressed when the code is online.
In fact, a float can solve it
Spaces are also characters. Set font-size:0; on the parent element of inline-block to eliminate it.