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 6 of 6
  1. #1
    New to the CF scene
    Join Date
    Aug 2012
    Location
    INDIA
    Posts
    9
    Thanks
    8
    Thanked 0 Times in 0 Posts

    Unable to make out the content area background

    Hello everyone, I am playing with some HTML & CSS code in order to learn practically. I am not getting why the background for the content class i defined in the .Css file isnt visible.

    *{
    margin:0;
    padding:0;
    }
    html {

    }
    body {
    min-height: 900px;
    font:14px/1.3 Arial,sans-serif;
    background: #000000 url(images/main_bg.jpg) repeat-x;
    }
    header {

    box-shadow: 0 -1px 2px #111111;
    color:#fff;
    display:block;
    height:70px;
    position:relative;
    width:100%;
    z-index:100;
    }
    header h2{
    font-size:22px;
    font-weight:normal;
    left:50%;
    margin-left:-400px;
    padding:22px 0;
    position:absolute;
    width:540px;
    }
    header a.stuts,a.stuts:visited{
    border:none;
    text-decoration:none;
    color:#fcfcfc;
    font-size:14px;
    left:50%;
    line-height:31px;
    margin:23px 0 0 110px;
    position:absolute;
    top:0;
    }
    header .stuts span {
    font-size:22px;
    font-weight:bold;
    margin-left:5px;
    }
    .container {
    height: auto;
    margin: 0px auto;
    width: 957px;

    }
    .content{
    height: 900px;
    margin: auto auto;
    width: 957px;
    background: url(images/content_bg.jpg) top center no-repeat;
    color:#fcfcfc;
    }




    footer{
    background-color: #111111;
    bottom: 0;
    box-shadow: 0 -1px 2px #111111;
    height: 45px;
    left: 0;
    position: fixed;
    width: 100%;
    z-index: 100000;
    display: block;
    }

    footer h2{
    color: #EEEEEE;
    font-size: 14px;
    font-weight: normal;
    left: 50%;
    margin-left: -400px;
    padding: 13px 0 0;
    position: absolute;
    width: 540px;
    }

    footer h2 i{
    font-style:normal;
    color:#888;
    }

    footer a.tzine,a.tzine:visited{
    color: #999999;
    font-size: 12px;
    left: 60%;
    margin: 16px 0 0 110px;
    position: absolute;
    text-decoration: none;
    top: 0;
    }

    footer a i{
    color:#ccc;
    font-style: normal;
    }

    footer a i b{
    color:#c92020;
    font-weight: normal;
    }


    ////////////////////////////////////HTML CODE///////////////////

    <!DOCTYPE html>
    <html lang="en" >
    <head>
    <meta charset="utf-8" />
    <title>Welcome</title>
    <link href="styles/layout.css" rel="stylesheet" type="text/css" />
    <link href="styles/menu.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
    <header>
    <h2>XpertCareers</h2>

    </header>
    <div class="container">

    <ul id="nav">
    <li><a href="#">Home</a></li>
    <li><a class="hsubs" href="#">Menu 1</a>
    <ul class="subs">
    <li><a href="#">Submenu 1</a></li>
    <li><a href="#">Submenu 2</a></li>
    <li><a href="#">Submenu 3</a></li>
    <li><a href="#">Submenu 4</a></li>
    <li><a href="#">Submenu 5</a></li>
    </ul>
    </li>
    <li><a class="hsubs" href="#">Menu 2</a>
    <ul class="subs">
    <li><a href="#">Submenu 2-1</a></li>
    <li><a href="#">Submenu 2-2</a></li>
    <li><a href="#">Submenu 2-3</a></li>
    <li><a href="#">Submenu 2-4</a></li>
    <li><a href="#">Submenu 2-5</a></li>
    <li><a href="#">Submenu 2-6</a></li>
    <li><a href="#">Submenu 2-7</a></li>
    <li><a href="#">Submenu 2-8</a></li>
    </ul>
    </li>
    <li><a class="hsubs" href="#">Menu 3</a>
    <ul class="subs">
    <li><a href="#">Submenu 3-1</a></li>
    <li><a href="#">Submenu 3-2</a></li>
    <li><a href="#">Submenu 3-3</a></li>
    <li><a href="#">Submenu 3-4</a></li>
    <li><a href="#">Submenu 3-5</a></li>
    </ul>
    </li>
    <li><a href="#">Menu 4</a></li>
    <li><a href="#">Menu 5</a></li>
    <li><a href="#">Menu 6</a></li>
    <li><a href="Login.html">Login</a></li>
    <div id="lunar"></div>
    </ul>
    </br>

    </div>

    <div class="content">
    hello world hello worldhello worldhello worldhello </br>
    hello world hello worldhello worldhello worldhello </br>
    hello world hello worldhello worldhello worldhello </br>
    hello world hello worldhello worldhello worldhello </br>
    </div>



    <footer>
    <h2>&copy; 2012 <i>TechGeeks<i> |</h2> <a class="tzine">Design by TechGeeks Team
    </footer>
    </body>
    </html>
    Last edited by prateek88; 10-08-2012 at 09:59 PM.

  • #2
    Senior Coder coothead's Avatar
    Join Date
    Jan 2004
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    1,703
    Thanks
    0
    Thanked 233 Times in 228 Posts
    Hi there prateek88,

    we really require a link to the problematic site, to enable us to properly assess the problem.

    coothead

  • Users who have thanked coothead for this post:

    prateek88 (10-08-2012)

  • #3
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Hello prateek88,
    When I use your code and provide my own image it all seems to work. I would suggest checking the path to content_bg.jpg as well as spelling and capitalization.

    If that doesn't help then, like coothead suggests, a link to the test site is always better since we don't have your images and there could be some error in the live code.

    When posting code in the forum, please use the code tags, &#91;code&#93;&#91;/code&#93; - available with the # button in the post edit window.
    This will wrap your code in a scroll box which greatly helps the readability of your post.
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • Users who have thanked Excavator for this post:

    prateek88 (10-08-2012)

  • #4
    New to the CF scene
    Join Date
    Aug 2012
    Location
    INDIA
    Posts
    9
    Thanks
    8
    Thanked 0 Times in 0 Posts
    @coothead and Excavator

    thanks for your valuable reply and effort. I wish i could provide the test site(as i am new to this thing i am not sure how to do that) but heres the image which might give you the view of what i want to achieve.

    Edit: If its OK with the forum could i provide the whole source .rar link....????
    Last edited by prateek88; 10-08-2012 at 11:03 AM.

  • #5
    Senior Coder coothead's Avatar
    Join Date
    Jan 2004
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    1,703
    Thanks
    0
    Thanked 233 Times in 228 Posts
    Hi there prateek88,

    can you give us the "main_bg.jpg" image then?

    Use the "Manage Attachments" facility.

    coothead

  • Users who have thanked coothead for this post:

    prateek88 (10-08-2012)

  • #6
    New to the CF scene
    Join Date
    Aug 2012
    Location
    INDIA
    Posts
    9
    Thanks
    8
    Thanked 0 Times in 0 Posts
    sorry coothead and Excavator, it was me totally stupid wasted your time. the problem was in specified path only. I should specify directly the filename.jpg since the image was in the same folder in which the .css file exist.

    next time i will keep in mind to submit posts without such stupid mistakes.

    still sending the main_bg file. May be i should ask in new thread the other question. thanks for your help.
    Attached Thumbnails Attached Thumbnails Unable to make out the content area background-main_bg.jpg  


  •  

    Tags for this Thread

    Posting Permissions

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