To make two elements float, you can use CSS float property. This property specifies whether an element should float to the left, right, or not at all. This code floats both element1 and element2 to the left and sets their width to 50% of their containing block so that they can be positioned side by side.

The most common way to place two divs side by side is by using inline-block css property. The inline-block property on the parent placed the two divs side by side and as this is inline-block the text-align feature worked here just like an inline element does.

Positioning with Inline-Block In addition to using floats, another way we can position content is by using the display property in conjunction with the inline-block value. The inline-block method, as we'll discuss, is primarily helpful for laying out pages or for placing elements next to one another within a line.

You can use the <div> tag to create two columns within one column in HTML. You can then use the float CSS property in conjunction with the width property to define the width of each div element.