I want to convert THIS site

Since you are new to CSS, this is a piece of advice that I would remember. This can be used to save you headaches on just about any site. I include it in all of my CSS files.

 

ok , well you guys are going to get sick of me.
well first off thanks chaosfoo that helps alot,

second, i hit another problem. check it out, http://typh.ca/pstemp/cssindex.html the link's don't lead anywhere just to warn you. but the problem i'm havin is in firefox, In the code between my first image and teh rest i put a <br> to put the rest of teh images below that one. the images however seperate completely showing a gap , where as i don't want a gap they need to be flush. so I set border padding and margin to 0px and border to none, but the gaps are still there

please help, and again i'm sorry to bother everyone, I tried googleing teh answer but could not find it.

thanks again
phil.

 

i dont use that one.. but im not having problem with my codes... whats that for anyway??

 

Well I fixed the top part but screwed up the bottom

Changed the top section to this:

<div id="pagetop">

<img src="cssindex_files/01links_01.jpg" height="39" width="761">

<div>
<img src="cssindex_files/01links_02.jpg" height="39" width="185">
<a href="http://typh.ca/index.php"><img src="cssindex_files/01links_03.jpg" border="0" height="39" 

width="36"></a>
<a href="http://typh.ca/contactus.php"><img src="cssindex_files/01links_04.jpg" border="0" height="39" 

width="67"></a>
<a href="http://typh.ca/testimonials.php"><img src="cssindex_files/01links_05.jpg" border="0" height="39" 

width="78"></a>
<a href="http://typh.ca/measuring.php"><img src="cssindex_files/01links_06.jpg" border="0" height="39" 

width="66"></a>
<a href="http://typh.ca/install.php"><img src="cssindex_files/01links_07.jpg" border="0" height="39" 

width="76"></a>
<a href="http://typh.ca/links.php"><img src="cssindex_files/01links_08.jpg" border="0" height="39" 

width="39"></a>
<a href="http://typh.ca/faq.php"><img src="cssindex_files/01links_09.jpg" border="0" height="39" 

width="26"></a>
<img src="cssindex_files/01links_10.jpg" height="39" width="187">
</div></div>

Code (markup):

Only change in the style was adding:

div, img{
padding:0;
margin:0;
}
div img {
float:left;
}

Odds are you can use IDs to reduce the damage to the lower half. Maybe it'll help get you back on track.

 

You mean the star trick * { padding:0; margin:0; } >???

It resets everything to 0 padding and margin. Another trick is to put border: solid black 1pt; and it will outline the entire page.