1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Background shadow png not displayed

Discussion in 'Troubleshooting and Problems' started by bogus, Dec 19, 2010.

  1. bogus

    bogus Guest

    I am trying to add a shadow png to my fixed style with some probs.

    What i´ve done till now ist:

    EXTRA.css
    Code:
    .bgmid {
    background: url(test/schadow_bg.png) repeat-y;
    background-position: top;
    }
    and i added the div class in PAGE_CONTAINER
    under <div class="pageContent"> with <div class="bgmid">

    the closing </div> is located under <div class="breadBoxBottom"><xen:include template="breadcrumb" /></div>

    The problem is that the shadow image does not appear.
    I am not a coder and have certainly done something wrong
     
  2. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

    Can you post a URL to your forum so we can debug the page?

    I always put single quotes around background urls. I'm not sure if that is required though:

    Code:
    background: url('test/schadow_bg.png') repeat-y;
    
     
  3. bogus

    bogus Guest

    well xf.brainlag.eu
    i´ve just added all of the images, that you can take a look
     
  4. Brogan

    Brogan XenForo Moderator Staff Member

    I'm not seeing any css related to a background image.
    Have you removed it?
     
  5. bogus

    bogus Guest

    No its still in.
    Give it a try again. maybe my friend was changing something, i have added all
     
  6. Brogan

    Brogan XenForo Moderator Staff Member

    Ah yes, just found it.
    Will have a look now.
     
    bogus likes this.
  7. bogus

    bogus Guest

    This is the code from the extra.css
    Code:
    .shadowfooter {
    background: url(test/shfooter.png) bottom no-repeat; padding: 20px; margin-left:0px
    }
    
    .bgmid {
    background: url('test/schadow_bg.png') center repeat-y;
     
  8. Brogan

    Brogan XenForo Moderator Staff Member

    I got it to work on the main content by doing this:
    image.PNG

    However the bottom shadow is repeated all the way down and it doesn't appear on the header section but that should be easy to solve by adding a background image for that section.
     
  9. bogus

    bogus Guest

    if i do it that way, to add the png to the properties section it, as you already wrote, will repeat till the bottom.
    Thats why i thought to add it directly to the container template with a closing div, which actually does not work ;)
    Just take a look now. i´ve done it the way you wrote.
     
  10. Brogan

    Brogan XenForo Moderator Staff Member

    That looks a lot better.
    You just need to sort out the footer and header now.
     
  11. bogus

    bogus Guest

    Got it :D
    So easy.... If you know ;) ... All changes in page_container

    well. I´ve added the class <div class="bgmid"> direcly after <body>
    and closed the it with a </div> right after </header>

    Rest is simple too;) the footer class <div class="bgfooter"></div> is added after </header>

    In extra.css i added
    Code:
    .bgfooter {
    background: url(test/shfooter.png) bottom no-repeat; padding: 20px;
    }
    
    .bgmid {
    background: url('test/schadow_bg.png') center repeat-y;
    }
    You just have to change maybe the padding. cause its different from template to template. and then you have an imaged shadow. And for sure the image Path
    If any is interested in i will add this to the Template Forum, later ;)

    Thanks to all of you especially Brogan. He is always a helping Hand.
     

Share This Page