Align left and right text on the same line?

Question

Ahoy,

I'm trying to have a single line in a header with text on the left and on the right. I have tried 

<div align="left">This is on the left</div><div align="right">This is on the right</div>

Which correctly aligns the text on the left and right, but the right text moves down as pictured below. Is there anyway to have it all line up horizontally?

Picture here

I am using tweego and Sugarcube 2.27

Answer 1

For what you want, the "float" property does the trick:

<div style="float: left">This is on the left</div><div style="float: right">This is on the right</div><div style="clear: both;"></div>

The <div> at the end makes sure nothing ends up between those two floats.

For details see "All About Floats".

Comments

Awesome, that's exactly how I wanted it to work. Thanks HiEv.