How to align a div to the top of its parent but keep its inline-block behaviour with CSS?

Spread the love

Sometimes, we want to align a div to the top of its parent but keep its inline-block behaviour with CSS.

In this article, we’ll look at how to align a div to the top of its parent but keep its inline-block behaviour with CSS.

How to align a div to the top of its parent but keep its inline-block behaviour with CSS?

To align a div to the top of its parent but keep its inline-block behaviour with CSS, we set the vertical-align property.

For instance, we write

#box1 {
  width: 50px;
  height: 50px;
  background: #999;
  display: inline-block;
  vertical-align: top;
}

to add vertical-align: top; to move the element to the top of the parent.

Conclusion

To align a div to the top of its parent but keep its inline-block behaviour with CSS, we set the vertical-align property.

Leave a Reply

Your email address will not be published.