Problems with the calculation method of p width
box-sizing can specify the width value to be calculated using content, margins, and borders as boundaries
Calculating the width as a percentage may cause the total actual width to exceed the total width of the parent container. For left-floating p, it is a line break. For example, left-floating has no effect
It is generally better to post the code for easier analysis.
If none of the answers above work, you can take a look at this http://www.html-js.com/article/Do-not-obey-the-inlineblock-browser-on-...
If the poster uses inline-block, then the browser actually treats the poster's two p's as inline elements, and inline elements have spaces on both sides by default. The poster tries to set font- on its parent element. size:0px; so that the space size on both sides does not take up space. Then follow a -webkit-text-size-adjust:none to solve the problem that the minimum text of the chrome system is 12px
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
box-sizing:border-box
Try changing the
border,inner margin,outer margin, etc. of the two p's to 0Problems with the calculation method of p width
box-sizing can specify the width value to be calculated using content, margins, and borders as boundaries
Calculating the width as a percentage may cause the total actual width to exceed the total width of the parent container. For left-floating p, it is a line break. For example, left-floating has no effect
Is it IE7? If not, are padding and border-width set? If not, is there a box-sizing: border-box with a margin value set? show us the code.
Pay attention to the box model and consider border padding margin
It is generally better to post the code for easier analysis.
If none of the answers above work, you can take a look at this http://www.html-js.com/article/Do-not-obey-the-inlineblock-browser-on-...
Look at the box model. The "CSS Design Guide" makes it very clear.
If the poster uses inline-block, then the browser actually treats the poster's two p's as inline elements, and inline elements have spaces on both sides by default. The poster tries to set
font- on its parent element. size:0px;so that the space size on both sides does not take up space. Then follow a-webkit-text-size-adjust:noneto solve the problem that the minimum text of the chrome system is 12px