All Posts by Email, Once a Week

Media Temple logo

CSS-Tricks is brought to you in part by Media Temple, the web hosting that we both use and recommend.

help with the span tag

  • # June 15, 2008 at 11:04 pm

    I am using <span> in my markup. It has to be there. What I need to know is how I can add a width to the span tag. I have a background color for the text inside the span tag, but it ends at the end of the tag. I tried to add a width property. but it doesn’t work. I need the background color to span farther than the text inside the tag. The only way i can find to do that right now is by adding &nbsp; but this isn’t an exact measurement so it’s not perfect. is there anything i can do here?

    # June 16, 2008 at 2:33 am

    Try adding display: block; to your style for the span(s) in question. Inline elements don’t hold dimensions the same as block elements. One thing to note here is that if you change the display from inline to block you may have to float the element(s) as well, depending on how you want the layout to flow. Hope this helps.

    Best Regards,

    # June 16, 2008 at 11:14 am

    This reply has been reported for inappropriate content.

    Yeah spans are by default inline elements which do not honor the width property. Switching it to block might be more trouble than it’s worth though. try just adding a bit of padding, that should work fine for extending the background out a bit more.

    When display: inline-block is more widespread supported, this will fix that issue :D

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed