Moving Beyond Tables-.Understanding the DIV :)-

Question

Hello,
Unfortunately I was taught Dreamweaver sorta backwards and have always used tables for layout.  The advantage has always been a grid layout where you can move things by sliding the guides around.  It works most of the time, but I am determined to move beyond it.
I admit my Dreamweaver skills are fair at best, and appreciate any input…. please be kind
Here is the current webpage : http://www.outposticearena.com/
Here is my rough draft (very much improved with added animation)…. and still confused regarding layout….http://taffyproductions.com/test/
1) Why are there lines between my sidebar1/nav?  Which css rules control their spacing and size?
2) How do I control the top and bottom spacing between my H2 tag "Welcome to the Cooloop" and the .p tag below it?
3) I have 4 images/links in the sponsors div.  I want to center/ space them.  How can I do this?
Thanks again!!!
Gary

Answer 1

1. In style.css  Line 111
ul.nav li
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: #666666;
Remove the border and gone are the lines
2. At the start of style.css place the following code
* {margin:0;padding0;}
Each browser has its own default style rules. If they were all the same rules then we could live with it. Because they are not the same, it is best to bring all of the styli rules down to one denominator by setting the margins and padding to zero. This may mess up some of the other styles, but these can be fixed by a bespoke setting of the margins and padding.
3. First we need to re-arrange our markup
<div id="footer1">
    <div><a href="http://www.abqfsc.org/" target="_blank"><img src="images/afsc.jpg" alt="albuquerque figure skating club"/></a></div>
  <div><a href="http://www.nmhockey.com/" target="_blank"><img src="images/nmhockeyadult.gif" alt="NM Hockey" /></a></div>
  <div><a href="http://apps.planethockey.com/site/camps/default.aspx?CampId=176" target="_blank"><img src="images/planet_hockey.gif" alt="planet hockey" /></a></div>
  <div><a href="http://www.nmice.org/" target="_blank"><img src="images/nmice.jpg" alt="New Mexico Ice Hockey" /></a></div>
  <p>Web Design by <a href="http://taffyproductions.com/" target="_blank">Gary Goldblum</a></p>
</div>
Then we will add a bit of styling
#footer1 div {
    width: 25%;
    float: left;
#footer1 div img {
    display: block;
    margin: auto;
As a passing comment, just one question per post please.