margaux — 2012-04-30T09:55:19-04:00 — #1
my radio buttons are displaying inline one after another and I'd like them to display as a vertical list. How can I achieve that using CSS only?
<input type="radio" name="surveyField" value="" />Option1
<input type="radio" name="surveyField" value="" /> Option2
ryanreese — 2012-04-30T13:36:39-04:00 — #2
I'd place a <br /> after each input. That'll allow CSS to be off and still maintain the accessibility of the form (aka keep it still readable and very usable) :). There was a thread recent on this topic, and majority of the people here agreed with this.
margaux — 2012-05-02T04:47:05-04:00 — #3
Thanks for replying. Generally I don't like to use <br /> in this situation, though I do know it is an easy solution. Using list tags and setting list-style-type: none; is also an option. But as I'm doing alot of styling on this particular form, I prefer to keep the markup separate so have gone for input[type="checkbox"], might as well use the new selectors.
ryanreese — 2012-05-02T08:30:36-04:00 — #4
Why not? It's the best option to use here. Otherwise you'll be messing with some weird CSS.
Your option with lists involves you adding a lot of unsemantic markup, just to achieve what a <br> would.