I have a basic question. I have 2 div, and inside each one there is a paragraph. In the css I have the div with measure and with inline-block. My question is: Why is the first paragraph lower than the other? If I change the paragraphs, the exact same thing happens. The second paragraph is below the first.
div{
width: 200px;
height: 200px;
display: inline-block;
}
<body>
<div>
<p>Lorem ipsum, dolor sit amet consectetur adipisicingsint totam tempora ipsa. Ipsa unde nobis laborsaepe esse
doloribus aliquam id libero.</p>
</div>
<div>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Nihil commodi sint ab ipsa quas quae! Temporibuslit.
Nihil commodi sint ab ipsa quas quae! Temporibus athtrhliquid hic assumenda deserunlit. Nihil commodi sint
atationem delectus necessitatibus natus aliquam at?</p>
</div>
</body>
You can use vertical-align to achieve the vertical alignment of the element or elements and, in this case, move them to the top of their container in this way: