PDA

View Full Version : WHy is there so much space, CSS




janitorC7
Oct 28, 2006, 02:27 AM
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



radiantm3
Oct 28, 2006, 05:03 AM
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

Your nav buttons are each contained in paragraph tags which have a default top and bottom margin.

janitorC7
Oct 28, 2006, 05:11 AM
ahhhh well you were right

thanks

benneh
Oct 28, 2006, 07:39 AM
for footer: after your NAVLINKS and before closing your #wrap div, add a DIV that has css of clear:both

nightelf
Oct 28, 2006, 10:10 AM
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

janitorC7
Nov 5, 2006, 05:33 PM
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

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