Grow your CSS skills. Land your dream job.

Background Colour For Paragraph

  • # May 25, 2009 at 7:14 pm

    Hello people.

    I’m having a little trouble setting the background colour of only the text within a paragraph, rather than the entire paragraph (block) having the background colour. I hope that makes sense. Here’s an example:

    This is what I am trying to achieve:

    [attachment=1]right.gif[/attachment]

    This is what I am getting:

    [attachment=0]wrong.gif[/attachment]

    I can’t for the life of me get it to happen although I’m sure I’ve done this accidentally before!

    Any help would be great.

    # May 25, 2009 at 11:55 pm

    The cause of the undesired affect is that Paragraphs are "block level elements" (ie, they make a rectangle).

    You can either a) make paragraph "display:inline" (or similar), or b) add a <span> (which is an inline element) inside your paragraph and assign the background color to that.

    Make sense?

    # May 26, 2009 at 12:00 am
    Code:


    This is paragraph text enclosed by span with a different background-color
    lets check
    what
    happens


    This is paragraph text with paragraph styling

    # May 26, 2009 at 9:29 pm

    Works a treat, thanks gents.

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

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".