8

Page in question: http://www.rjlacount.com/public/lander/

I'm probably just doing something stupid, but I'm trying to indent the second line of wrapping text inside the form (with "Your account: test@test.com" at the top) and I can't seem to get anything to work.

I would think the solution is:

form span {padding-left:1.5em;text-indent:-1.5em;}

but this only seems to indent the first line of each section.

Another look at this would be much appreciated, thanks!

1
  • 1
    This will not work. You have to either position radio box and the text or put each into a floating container.
    – user487772
    Jun 9, 2011 at 18:26

3 Answers 3

10

If the element is inline it will indent the first line, otherwise if it's a block element it will indent the rest of the lines, which is just like Briguy37 said, since that's the difference between DIV and SPAN. I just wanted to clear out that it's not a "problem with span".

0
3

For some reason, this works with a DIV, but not with a SPAN. Not really sure why, but here's a fiddle with the same CSS for both.

2
  • Weird. Thanks for the response. Wrapping each input in a <p> tag works too. Seems kinda weird, but it'll work.
    – R.J.
    Jun 9, 2011 at 18:38
  • 3
    <span> is inline by default, while <div> and <p> are block by default. I haven't tried it, but I bet if you set display:block on the span and display:inline on the div, you'll reverse the indentation behavior. ;)
    – Shauna
    Jun 9, 2011 at 18:46
2

spans are handled as inline elements.

Considering them as actual characters helps to conceptualize the changes. A space after a span is retained because it's like a space between characters. You adjust height by line-height rather than simply height. etc etc

Usually if this is causing a problem you can just use a div and set display:inline-block; if you need horizontal alignment.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.