WHy is there so much space, CSS

Discussion in 'Web Design and Development' started by janitorC7, Oct 27, 2006.

  1. janitorC7 macrumors 6502a

    janitorC7

    Joined:
    Feb 10, 2006
    Location:
    North Hollywood, CA
    #1
    2 Questions.

    1st, why is my navigation Bar not lined up with the top of the image, or for that matter bottom of my top bar.

    Second, why is there spaces inbetween my nav bars on the right, like the white space.

    3rdly how can I do a footer?

    Thanks Guys

    http://fairwayreversemortgages.com/Untitled-1.html

    Again, I'm just doing this in CSS now, Converting from tables, so new at this
    HATED TABLES
     
  2. radiantm3 macrumors 65816

    radiantm3

    Joined:
    Oct 16, 2005
    Location:
    San Jose, CA
    #2
    Your nav buttons are each contained in paragraph tags which have a default top and bottom margin.
     
  3. janitorC7 thread starter macrumors 6502a

    janitorC7

    Joined:
    Feb 10, 2006
    Location:
    North Hollywood, CA
  4. benneh macrumors member

    Joined:
    Oct 20, 2006
    #4
    for footer: after your NAVLINKS and before closing your #wrap div, add a DIV that has css of clear:both
     
  5. nightelf macrumors 6502

    Joined:
    Mar 25, 2003
    #5
    I would suggest that you use <UL> for your nav. It would be less code. Also instead of writing the CSS in the head of the file, it would be better to have it "attached" or imported. That way you only edit 1 file and your whole site would be updated. The word navigation is not necessary.

    Example

    <ul class="nav">
    <li><a href="#">Home</a></li>
    <li><a href="#">Overview</a></li>
    </ul>

    ul.nav {
    background: #ccc;
    list-style: none;
    margin: 0;
    padding: 0;
    }

    ul.nav li {
    padding: 0;
    margin: 0;
    }

    ul.nav a {
    padding: 4px;
    color: #666;
    text-decoration: none;
    display: block;
    text-align: center;
    }

    ul.nav a:hover {
    text-decoration: none;
    text-align: center;
    background: #bbb;
    }


    When your visitors put the cursor over the link the background of the menu item will get a bit darker. The CSS should be right, but i did not preview it :p Set the font and size in the ul.nav
     
  6. janitorC7 thread starter macrumors 6502a

    janitorC7

    Joined:
    Feb 10, 2006
    Location:
    North Hollywood, CA
    #6
    oh thanks. I think I got it now. As for an attached sheet. I plan on doing that. However I just perfer to do all the code with it in one sheet and then export it later when I deliver the final product. Thanks

     

Share This Page