Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS New to CSS

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #27529
    Chris Enloe
    Member

    Hey,

    I am quite new to CSS, still in the process in learning what everything does. So I was designing, and I have gotten to a problem. Why is the white space at the bottom, and how may I fix it? I have included my CSS so far, and no it’s not complete yet. I have a live link on a test server, but for some reason the background isn’t showing up as well, but if you have the Editor Toolbar for Firefox then just "Edit CSS", and then you can see it. Can anyone help me with these two problems?

    http://atest1.vistapanel.net/chrisperso … onal2.html

    Code:
    /*
    By: Chris Enloe
    */

    * {
    margin: 0;
    padding: 0;
    }

    body {
    background: url(images/bodyBG.jpg) repeat-x;
    color: #f0f0f0
    }

    #page-wrap {
    margin: 0 0 0 320px;
    position: relative;
    }

    a img {
    border: 0;
    }

    .clear {
    clear: both;
    }

    h2 {
    font: 30px “Georgia”;
    }

    p {
    font: 14px “Georgia”;
    }

    #content-wrap {
    float: left;
    width: 826px;
    }

    #content-area {
    float: left;
    width: 590px;
    background: #1f1f1f;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    padding: 16px;
    position: relative;
    z-index: 100;
    min-height: 600px;
    }

    #content-area a {
    color: #f0f0f0;
    }

    #content-area a:hover {
    color: #7a7c7c;
    }

    ul#nav {
    float: left;
    list-style: none;
    font: 35px “Georgia”;
    }

    ul#nav a {
    text-decoration: none;
    color: #000;
    font-weight: bold;
    font-style:
    }

    #header {
    height: 110px;
    margin-left: 30px;
    }

    #header a {
    border: 0px;
    }

    #69231
    WildSpirit
    Member

    Hi Chris,
    I’m also newer to CSS and building websites in general but I actually think I know what is happening!
    I don’t think your background image (bodyBG.jpg) is tall enough and that is why you are seeing the white.

    You could go back into photoshop (or wherever you created that image) and make it much taller OR the easier way would be to add a background color that is the same color as the bottom of your bodyBG.jpg image (that dark gray color).

    So the CSS for that would look something like this:

    body {
    background: url(images/bodyBG.jpg) color:#thatdarkgraycolor; repeat-x;
    color: #f0f0f0
    }

    As for the image not showing up unless I "edit css" from firefox web developer, make sure the image is really uploaded and has the correct filepath.

    Hope that helps! :)
    ~Lyle

    #69239
    Chris Enloe
    Member

    I fixed the Background issue, but I am still having the issue of the background actually coming up without the Designer Toolbar…. :| I hope that I can figure this out.

    #69256
    Chris Enloe
    Member

    Thanks for the help so far! :) I think that I have come pretty far in two months now. But right now, I really don’t care if things validate or not, I just want to get things where I want them to be, but nevertheless, thanks!

    #69259
    Chris Enloe
    Member

    I just did that code for the background, just like you posted. When I opened it up in the browser it worked just fine! Thanks for that!

Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘CSS’ is closed to new topics and replies.