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 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Nov 2011
    Posts
    6
    Thanks
    2
    Thanked 1 Time in 1 Post

    Content needs to appear above a background but hide behind an image.

    Hi

    It looks like I got a bit cocky and sold a design to one of my clients that I am having trouble building.

    Please take a look at the attached file so you can see what I am talking about.

    1. The web page’s height dynamically needs to expand vertically.

    2. The swirly design in the background has to stay at the bottom with the footer when the web page expands.

    3. The yellow area represents the place where I need to put content that will also expand vertically. It needs to stay behind the circle herb images and in front of the swirly design.

    4. The circle herb images can never move in position nor can the navigation.

    Please go to the following URL and you can see what I have designed so far.

    http://www.webskillsplus.com/massage/index.html

    Take a look at demo.css

    Code:
    html {
    	background: #5e88a2 url(../img/dice_slice.jpg) repeat-x;
    }
    body {
    	padding: 0;
    	margin: 0;
    	background: url(../img/bg.jpg) no-repeat center top;
    	width: 100%;
    	display: table;
    }
    .header	{
    	width: 960px;
    	background: url(../img/header.jpg) no-repeat center top;
    	height: 196px;
    }
    .footer	{
    	float: left;
    	width: 960px;
    	background-color: #b9b299;
    	height: 86px;
    }
    .container_12 {
    	height: 100%;
    	background: url(../img/design.jpg) no-repeat center bottom;
    }
    I could make .container_12 solid white but it covers the circle herb images.
    Attached Thumbnails Attached Thumbnails Content needs to appear above a background but hide behind an image.-page_1.jpg  

  • #2
    New Coder
    Join Date
    Jan 2012
    Location
    Romania
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts
    look into css command

    z-index:

    it should do what you need


  •  

    Posting Permissions

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