have a problem with my blog

Discussion in 'HTML & Website Design' started by cscott5288, Sep 28, 2009.

  1. #1
    I've got a wordpress blog that uses a plugin which alters the style of blockquote html markeup.

    I believe, and I am not sure, that it replaces the original css for blockquote in the template I am using.

    My problem is that I want to add an image background for the block quote. I am not sure if you can have multiple background images in the same css class, but even if I remove the current background image (which I need) in the plugin's css, I still can't get the image to appear in the background of any blockquote!

    Here is the css in the plugin:

    div.fancy-quote {
    	margin-top: 1em;
    	margin-bottom: 1em;
    	border: 1px solid #aaa;
    }
    
    div.fancy-quote div {
        /* not used, but available to you to use */
    }
    
    div.fancy-quote blockquote {
      font-size: 1.2em;
      line-height: 1.5em;
    	margin: 0.5em;
    	margin-bottom: -16px;
    	padding-bottom: 1.0em;
    	padding-top: -5px;
    	border: none;
    	padding-left: 10px;
    	padding-right: 10px;
            background: url(images/bq.png) bottom left no-repeat;
    }
    
    Code (markup):
    If I replace "background: url(images/bq.png) bottom left no-repeat;" with what I want to use:
    "background: url(wp-content/uploads/2009/09/quote.png) top left no-repeat;"
    the image still own't show! and I can't understand why ... but even if it did work, how can I have multiple images in the background, like one on the top and one on bottom? Thanks ahead!
     
    cscott5288, Sep 28, 2009 IP
  2. tejaswini

    tejaswini Peon

    Messages:
    42
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #2
    The first thing, I think you have given wrong url for the background image. I hope you have to give something like this
    "background: url(../uploads/2009/09/quote.png) top left no-repeat;"
    just try it
    Regarding the multiple backgrounds, you can refer to this article by W3C
    http://www.w3.org/TR/2005/WD-css3-background-20050216/#layering
    Hope it helps. But just remember that it would work for the browsers that support CSS3
     
    tejaswini, Sep 29, 2009 IP
    cscott5288 likes this.
  3. cscott5288

    cscott5288 Active Member

    Messages:
    912
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    60
    #3
    Wow, I can't believe I didn't realize that the directory needed to be specified from the respective location ... thanks all is working well, and the bg image worked in conjunction with the one I already had in the blockquote class.

    Rep added.

    Now that I have someones ear :) I wonder if you can determine a solution for getting the gray page background to appear in IE? It works in FF and Chrome but not in IE.

    Thanks a million for your help.
     
    cscott5288, Sep 29, 2009 IP