I have 2 html radio buttons (separated by <br />
tags) where the text is wrapping under the radio button instead of aligning with the left indent (due to the size it's containing div). The text wrapping is not the problem, the problem is that it is wrapping incorrectly under the radio button itself, instead of aligning with text in the line above it. I'm supposing someone styled the input tag somewhere in the cascade. I haven't done an exhaustive search of all the styles attached to this page, but shouldnt the text just automatically wrap correctly, like a bullet list?
And if not, how would i go about fixing this? Do i need to insert a <br />
tag where I want the lines to break so they will be properly aligned?
Thanks!
You can simply use CSS to force the text to wrap correctly. I'm assuming that you have a
<span>
tag around the text and so you can use the following to adjust its position:Hope that this helps! Tomer
Answer for 2015:
Since none of the other soultions worked for me, here's how I do it:
See http://jsfiddle.net/8jzss08p/
Works in: Firefox 41, Chrome 45, Internet Explorer 11
Sorry for answering this so late, I just came across this post, here's another solution :
First of all, the use of a
<br />
is generally not recommended, it's a lot better to try and use themargin
CSS property to create space between elements.It's also best in this situation to use CSS to do what you want to do. This is because by default those elements won't have this kind of behaviour.
In this case you would want something that looks like this:
And then your CSS would look like this: