Photoshop to Dreamweaver code - Adding a link to an image

Soldato
Joined
10 May 2004
Posts
3,790
Location
East Yorkshire, UK
Hi

I created a template in Adobe Photoshop, I have sliced it and when I open it in dreamweaver it looks fine. However when I add a link to an image to another page it knocks all the other images out of place and it looks a mess. Does anyone know how to correct this, I am trying to add the link to index_13.gif below is the code that photoshop throwed at me:
Code:
<table width="851" border="0" align="center" cellpadding="0" cellspacing="0" id="Table_01">
	<tr>
		<td rowspan="5">
			<img id="index_01" src="images/index_01.gif" width="1" height="200" alt="" /></td>
		<td colspan="3">
			<img id="index_02" src="images/index_02.gif" width="221" height="54" alt="" /></td>
		<td colspan="5">
			<img id="index_03" src="images/index_03.gif" width="523" height="54" alt="" /></td>
		<td rowspan="2">
			<img id="index_04" src="images/index_04.gif" width="105" height="99" alt="" /></td>
		<td>
			<img src="images/spacer.gif" width="1" height="54" alt="" /></td>
	</tr>
	<tr>
		<td rowspan="4">
			<img id="index_05" src="images/index_05.gif" width="2" height="146" alt="" /></td>
		<td colspan="4" rowspan="3">
			<img id="index_06" src="images/index_06.gif" width="407" height="97" alt="" /></td>
		<td colspan="3" rowspan="2">
			<img id="index_07" src="images/index_07.gif" width="335" height="94" alt="" /></td>
		<td>
			<img src="images/spacer.gif" width="1" height="45" alt="" /></td>
	</tr>
	<tr>
		<td>
			<img id="index_08" src="images/index_08.gif" width="105" height="49" alt="" /></td>
		<td>
			<img src="images/spacer.gif" width="1" height="49" alt="" /></td>
	</tr>
	<tr>
		<td>
			<img id="index_09" src="images/index_09.gif" width="33" height="3" alt="" /></td>
		<td rowspan="2">
			<img id="index_10" src="images/index_10.gif" width="204" height="52" alt="" /></td>
		<td colspan="2" rowspan="2">
			<img id="index_11" src="images/index_11.gif" width="203" height="52" alt="" /></td>
		<td>
			<img src="images/spacer.gif" width="1" height="3" alt="" /></td>
	</tr>
	<tr>
		<td>
			<img id="index_12" src="images/index_12.gif" width="3" height="49" alt="" /></td>
		<td>
			<img src="images/index_13.gif" alt="" name="index_13" width="216" height="49" id="index_13" /></td>
		<td>
			<img id="index_14" src="images/index_14.gif" width="24" height="49" alt="" /></td>
		<td colspan="2">
			<img id="index_15" src="images/index_15.gif" width="197" height="49" alt="" /></td>
		<td>
			<img src="images/spacer.gif" width="1" height="49" alt="" /></td>
	</tr>
	<tr>
		<td>
			<img src="images/spacer.gif" width="1" height="1" alt="" /></td>
		<td>
			<img src="images/spacer.gif" width="2" height="1" alt="" /></td>
		<td>
			<img src="images/spacer.gif" width="3" height="1" alt="" /></td>
		<td>
			<img src="images/spacer.gif" width="216" height="1" alt="" /></td>
		<td>
			<img src="images/spacer.gif" width="24" height="1" alt="" /></td>
		<td>
			<img src="images/spacer.gif" width="164" height="1" alt="" /></td>
		<td>
			<img src="images/spacer.gif" width="33" height="1" alt="" /></td>
		<td>
			<img src="images/spacer.gif" width="204" height="1" alt="" /></td>
		<td>
			<img src="images/spacer.gif" width="98" height="1" alt="" /></td>
		<td>
			<img src="images/spacer.gif" width="105" height="1" alt="" /></td>
		<td></td>
	</tr>
</table>

many thanks :)
 
Surround the image tag with <a href=''>IMAGE TAG HERE</a>. Then make sure the border of the image is set to 0, so add into the image tag border=0.

That shouldn't unsettle any of the other images.
 
I decided to change it all to a float css and it seems to be working a lot better. Does anyone know how i can use an image as a base for a drop down menu?
 
Back
Top Bottom