Question

I am not very familiar with CSS.
I have two li elements, each of them contain a label and input field. I would like to style them so that the “li**.input_two*” is located after “li*.input_one**” horizontally. What is the CSS for this?

<li class="input_one" id="first_input">
  <label>name</label>
  <input id="the_name" type="text"/>
</li> 

<li class="input_two" id="second_input">
  <label>age</label>
  <input id="the_age" type="text"/>
</li> 

Answer 1

If you want the label and the input next to each other then something like this should do this trick:

.input_one label,
.input_one input
{
    float:left;
}

If you want the two li’s next to each other then try this:

li
{
    float:left;
}