Change line spacing from <br> to other line spacing methods in css - css

Question

I am writing an HTML5 page at the moment, I'm having an issue switching format from using br for line spacing to line-height, padding, or margin (whichever is easier). Everything is inside of a form and fieldset tag I do not want every line to be on their own, just some. Some text I do want next to each other because I am making a form that has radio buttons and check boxes. But instead of using br tags how I can switch that out to line-height, padding, or margin in css.
<form>
<fieldset class = "top">
Please Select a car: <br>
<input type="radio" name="car" value="truck">truck
<input type="radio" name="car" value="van">van
<input type="radio" name="car" value="suv">suv<br>
<input type="radio" name="car" value="coupe">coupe
<br>
<br>
<input type="checkbox" name="color" value="Blue">Blue
<input type="checkbox" name="color" value="red">red
<br>
<br>
<input type="checkbox" name="color" value="Orange">Orange
<input type="checkbox" name="color" value="black">Black
<br>
<br>
<input type="checkbox" name="color" value="Green">green
<input type="checkbox" name="color" value="brown">brown
<br>
<br>
....

Answer 1

Try to use a fieldset for each group of radios so you can control them more precisely, put margin only around your group and etc.
You can use labels and span around the label/input groups, so you can control them better.
<span>
<label for="name">Value</label>
<input type="checkbox" name="name" value="1"/>
</span>
Also if you use a class specific for your input, you can make it display in block, like this:
input.block {
display: block;
}
then if you put this class block on your input the label will stay in another line...
For a bigger picture see this fiddle:
http://jsfiddle.net/BxwNL/1/
Update: another solution according to cinnamon comment
You can also use a list for your items, but it would make sense if you grouped them according to their properties, like a list for the colours, a list for the types...
The usage would be like:
<ul>
<li>
<label for="name">Value</label>
<input type="checkbox" name="name" value="1"/>
</li>
<li>
<label for="name2">Value2</label>
<input type="checkbox" name="name2" value="2"/>
</li>
</ul>
Fiddle example for the list solution:
http://jsfiddle.net/BxwNL/2/