Having trouble with repeating image background

Discussion in 'HTML & Website Design' started by ayork2413, Dec 29, 2008.

  1. #1
    Ok, so i have an image background I want to use for <p> text. This background can only be repeated on the y axis (up and down, right?).

    My problem is that i want to set a margin for the text only, and not the text and background.

    As you can see from the screenshot, I need the text to be set to a margin only because the image needs to stay in line with the rest of the template.

    [​IMG]

    Here is the CSS i am using for <p>
    p {  
    	background-image: url(images/blogtap2_30.jpg);
    	background-repeat: repeat-y;
    	margin-left: 15px;
      margin-right: 15px;
    }
    HTML:
    any help would be vastly appreciated, thanks!
     
    ayork2413, Dec 29, 2008 IP
  2. Colbyt

    Colbyt Notable Member

    Messages:
    3,224
    Likes Received:
    185
    Best Answers:
    0
    Trophy Points:
    210
    #2
    Place the background image in a <div> with no padding and 0 margin and then place the content in another <div> with padding/margins. Or use the class you already have. The second div is really the key.
     
    Colbyt, Dec 29, 2008 IP