For the purpose of this tutorial, lets say you have some text you wish to display inline, where you want to align some of the text left and align some of the text right. First, add this to your styles.css file. Notice the width is 50%, and padding is only applied to the top and bottom. We do not apply padding to the left or right, because this causes the width to be greater than 100%.

.box50 {
    box-sizing: border-box;
    width: 50%;
    float: left;
}

Make sure the head of your page references the styles.css.

<link href="css/Styles.css" rel="stylesheet" type="text/css" media="screen" />

Use the following HTML in the body.

<div class="box50">
    Left
</div>
<div class="box50">
    Right
</div>
<div class="clear:both"></div>  

This causes the text to be inline.