Right now I have the following site... (and problem

)
Here is my site
And here is my CSS
Problem number 1: Do you see that
<p id="logo2">? It is supposed to be at the height of 22 pixels and at the width of 248 pixels... but it doesn't do that... it's an empty spot... I tried doing it with span but it's no go... See it... (The logo up top... there is no way to do that with the code staying valid that I know yet...
Problem number 2: Resize the browser... see how the contents move below the menu?
Problem number 3: At the bottom of the page there is a list of pictures (all are the same image) the first one however is a link image with a linked caption... click on it at the left side... then on the right side... frustrating...
Problem number 4: The images are supposed to be spread out... with a margin of 5 pixels on the left side... they actually go over each other... and even 1000 pixels doesn't solve it... the margin shifts the first column of pictures to the right but the other 2 columns stay put... unless you put 1000 pixels which would make it go out and into one straight army line... frustrating.
I tried fixing problem 4 by changing the CSS from
.img {
float: left;
width: 100px;
text-align: center;
margin-left: 5px;
height: 140px;
}
- .img {
- float: left;
- width: 100px;
- text-align: center;
- margin-left: 5px;
- height: 140px;
- }
to
.img {
display: inline;
width: 100px;
text-align: center;
margin-left: 5px;
height: 140px;
}
- .img {
- display: inline;
- width: 100px;
- text-align: center;
- margin-left: 5px;
- height: 140px;
- }
Which
DID in fact solve the problem... errr...
THAT particular problem but it made another problem in it's place... the othertwo images after the linked one went down... aligned down and moved a bit to the left... frustrating...
Any help to solve those problems would be great... please... Please... PLEASE!
"Bring forth therefore fruits meet for repentance:" Matthew 3:8