Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New Coder
    Join Date
    Mar 2012
    Posts
    27
    Thanks
    13
    Thanked 0 Times in 0 Posts

    Bg not showing? I know it should!.

    Is there some stack rule I am not paying attention too? It seems that for some reason my div layers bg wont show.

    body code:
    Code:
    <!-- Header Areas: (Constent visual)--> 
    <header>
        <div class="headerBody"><div id="headerElement">    
        	<img src="/images/logo.png" width="242" height="110" alt="The Mind Company" longdesc="http://www.themindspot.com">
    		<nav id="headNav"><script>loadContent('headNav','headNav.html');</script></nav>
        </div></div>
    </header>
    
    <!-- Content Areas: (Variable visual)-->
    <div id="contentBody">
        <br>
        <section id="homePage"><script>loadContent('homePage','home.html');</script></section>
        <section id="aboutPage"></section>
        <section id="productPage"></section>
        <section id="contactPage"></section>
    </div>
    
    <!-- Footer Area: (Constant visual)-->
    <footer>
        <div class="footerBody"><div id="footerElement">
            <div id="footNav" class="footLeft">
                <script>loadContent('footNav','footNav.html');</script>
            </div>
            
            <div id="footProjects" class="footLeft">
                <script>loadContent('footProjects','footProduct.html');</script>
            </div>
            
            <div id="footSocial" class="footRight">
                <script>loadContent('footSocial','footSocial.html');</script>
            </div>
            <div id="copyright">Copyright © 2012 The Mind Company</div>
        </div></div>
    </footer>
    style tag:
    Code:
    .headerBody, .footerBody {
      z-index:999;
      background-image:url(/images/clothBg.png);}
    #contentBody {
      background-image:url(/images/paperBg.png);}

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,863
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    Can we have a link to your page?
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • Users who have thanked abduraooft for this post:

    themindco (03-15-2012)

  • #3
    Banned
    Join Date
    Apr 2011
    Posts
    656
    Thanks
    14
    Thanked 69 Times in 69 Posts
    Code:
    z-index:999;
    z-index works only with css positioned elements.

  • Users who have thanked webdev1958 for this post:

    themindco (03-15-2012)

  • #4
    Regular Coder
    Join Date
    Aug 2005
    Location
    MS
    Posts
    843
    Thanks
    11
    Thanked 79 Times in 77 Posts
    Can't see where the header div has a background image since you also use an image tag. All that "<script>loadContent('blah','blah.html');</script>" probably has the wrong path relationships with pages using the content.

    As stated, a link would be nice.
    ☠ ☠RON☠ ☠

  • Users who have thanked Major Payne for this post:

    themindco (03-15-2012)

  • #5
    New Coder
    Join Date
    Mar 2012
    Posts
    27
    Thanks
    13
    Thanked 0 Times in 0 Posts
    Hello and thank you for your responses. The problem wasn't the the z-index, it was something I thought I would try(forgot to delete from post). I found out that you can lay your gradient color pattern in a background-image style tag in order to achieve what I wanted in the first place.

    Code:
      background-color: #141414;
      background-image: url(/images/paperBg.png);
      background-image: url(/images/paperBg.png),-webkit-gradient(linear, left top, left bottom, from(#141414),   to(#272727));
      background-image: url(/images/paperBg.png),-webkit-linear-gradient(top, #141414, #272727);
      background-image: url(/images/paperBg.png),-moz-linear-gradient(top, #141414, #272727);
      background-image: url(/images/paperBg.png),-ms-linear-gradient(top, #141414, #272727);
      background-image: url(/images/paperBg.png),-o-linear-gradient(top, #141414, #272727);
      background-image: url(/images/paperBg.png),linear-gradient(top, #141414, #272727);
    The link for you information is The Mind Company


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •