image links Options

[vivacious]

the link coordinates are scattered! I can't seem to get the images to function as links.

oh and after i input auto on the overflow, there is a problem with this huge gap horrizontally.

<!-- begin code provided by createblog.com --><br /><!-- begin code provided by createblog.com --><br /><img src="http://img.photobucket.com/albums/v236/simplestar/eternal%20ro/meandhimbg2.jpg";<br /><br /><br />USEMAP="#mymap" BORDER=0><br /><MAP NAME="mymap"><br /><AREA SHAPE='rect' COORDS='15, 119' HREF='http://www.xanga.com/' <br /><br />ALT='xanga.com'><br /><AREA SHAPE='rect' COORDS='100, 183' <br /><br />HREF='http://www.xanga.com/private/subscribeto.aspx?/user=han_neko <br /><br />ALT='add me'><br /><AREA SHAPE='rect' COORDS='50,272' <br /><br />HREF='http://www.xanga.com/CLAF/default.asp' ALT='customize'><br /><AREA SHAPE='rect' COORDS='22,379' <br /><br />HREF='http://www.xanga.com/private/home.aspx' ALT='your xanga'><br /><AREA SHAPE='rect' COORDS='89, 449' HREF='http://www.xanga.com/' <br /><br />ALT='refresh'><br /><AREA SHAPE='rect' COORDS='540,30' <br /><br />HREF='http://www.xanga.com/private/subs.aspx' ALT='subscriptions'><br /><AREA SHAPE='rect' COORDS='193,498,25' <br /><br />HREF='http://www.xanga.com/signin.aspx' ALT='sign in'><br /></MAP><br /><br /><br /><style type="text/css"><br />.mainleft, table.footer, table.navigation, HR{ display:none;}<br />body {<br />background-image:url();<br />background-color: #ffffff;<br />.module, .left, .blogbody, table.footer, .standard, .leftmodulefontcolor, td, p, .content, .smalltext, .standard {<br /><br />/* edits main text */<br />font:normal 8px arial;<br />color: #000000;<br />text-align:justify;}<br />/* edits the date */<br />div.blogheader, .caption <br />{background-image: url();<br />background-repeat:no-repeat;<br />background-position:center;<br />font-family: arial;<br />text-transform:none;<br />font-size:10px;<br />line-height:13px;<br />font-weight:normal;<br />color:#000000;<br />letter-spacing:2px;<br />background-color:none;<br />text-align:center;<br />border:1px solid #;}<br />.blogbody b, .standard b, p b, strong {<br />/* edits bolded text in your entry */<br />font-weight: bold;<br />color: #808080;}<br />input, select, textarea, iframe.htmleditor, .textfield, .button {<br />/* this edits the buttons, dropdowns, etc. */<br />border: #px solid #000000;<br />font:normal 8px Arial;<br />background-color: #FFFFFF;<br />text-transform:;<br />font-color:#000000;}<br /> table.footer TD {<br />/* this makes the footer at the bottom centered */<br />/* leave it alone unless you know what to do*/<br />text-align: center;}<br />table.left th {<br />/* on your menu module, this edits the title part of it */<br />/* like BLOGRINGS, POSTING CALENDAR, etc */<br />background-image: url();<br />background-color:none;<br />color: #FFFFFF;<br />font: bold #pt Arial;<br />text-transform: none;<br />text-align:center;<br />text-transform:;<br />border: #000000 #px solid;}<br />table.left { <br />/* this edits the menu module */<br />width:180px;<br />color:000000;<br />background-color:#FFFFFF;<br />BORDER: #000000 #px solid;}<br />font,td,p,xmp<br />{color:#000000;<br />font-face: Arial;<br />font-weight:normal;<br />font-size:8pt;<br />text-transform:;<br />text-align:justify;}<br />table.blogbody tr td { <br />/* this edits the left margin of blog */ <br />width:0px; <br />padding-left: 0px;} <br />table.blogbody {<br />/* this edits the other the place where the  blog is */<br />background-color:transparent;<br />family-font: Arial;<br />text-transform:;<br />BORDER: #000000 1px solid;<br />width:350px;}<br />a:link<br />{line-height: #pt; <br />font-family: Arial;<br />font-weight:normal; <br />color:#000000; <br />text-transform:none;<br />text-transform:;<br />font-size:8pt; <br />cursor:crosshair;}<br />a:active<br />{font-family: Arial; <br />color:#000000; <br />text-transform:none;<br />font-size:8pt;<br />text-transform:; <br />cursor:crosshair;}<br />a:visited<br />{font-family: Arial; <br />color:#000000; <br />text-transform:none;<br />text-decoration:strikeout;<br />font-size:8pt;<br />text-transform:;<br />cursor: crosshair;}<br />A:hover {font-family:Arial;<br />color:#000000;<br />text-transform:; <br />cursor: crosshair; <br />font-weight:bold;<br />text-transform:;<br />font-size:8pt}<br />table.navigation, table.footer { display:none; }<br />table.blogbody {<br />/* this edits the other the place where the  blog is */<br />background-color:transparent;<br />family-font: arial;<br />BORDER: #COLOR CODE #px solid;<br />width:405px; /*<-- make the number you entered for the width here smaller*/}<br /><br /><br /></style><br /><br /><br /><div style="overflow: none; width: 330px; height: 300px; margin-top: -492px; margin-left: 307px;"><br /><!-- end code provided by createblog.com --><br /><br /><br /><!-- begin code provided by createblog.com --><br /><!-- begin code provided by createblog.com --><br /><script type='text/javascript'><br /><br />shuffle = 1; //Replace 1 with 0 if you want to temporarily turn off this script<br /><br />      //you can keep adding more titles by copying over, as long as you change the number<br />title=new Array();<br />title[0] = "Memories - Once Upon A Time";<br />title[1] = "words cant describe what you showed me";<br />title[2] = "||amaterasu|| by rene";<br />title[3] = "r a d i a n c e"<br />title[4] = "i won't break down..i wont give up";<br /><br /><br />if (shuffle == 1) {<br />var randsg = Math.floor(Math.random()*title.length);<br />document.title = title[randsg];<br />}<br /></script><br /><!-- end code provided by createblog.com --><br /><!-- end code provided by createblog.com --><br /><br /><!-- begin code provided by createblog.com --><br /><br /><!-- begin code provided by createblog.com --><br /><style><br />u{<br />border-bottom: 1px Dashed #6495ED;<br />color:#808080;<br />}<br /></style><br /><!-- end code provided by createblog.com --><br /><br /><br /><br /><br /><!-- begin code provided by createblog.com --><br /><style type="text/css"><br />BODY {<br />scrollbar-arrow-color: #999999;<br />scrollbar-3dlight-color: #ffffff;<br />scrollbar-highlight-color: #ffffff;<br />scrollbar-face-color: #ffffff;<br />scrollbar-shadow-color: #ffffff;<br />scrollbar-darkshadow-color: #ffffff;<br />scrollbar-track-color: #ffffff;<br />} <br /></style><br /><!-- end code provided by createblog.com --><br /><br /><!-- begin code provided by createblog.com --><br /><DIV align="left" valign="middle" style="BORDER-RIGHT: #660000 1px solid; BORDER-TOP: #660000 1px solid; FILTER: alpha(opacity=100); OVERFLOW: auto; BORDER-LEFT: #660000 1px solid; WIDTH: 317px; BORDER-BOTTOM: #660000 1px solid; HEIGHT: 308px; BACKGROUND-COLOR:<br />#ffffff"><br /><!-- end code provided by createblog.com --><br /><!-- end code provided by createblog.com -->

-edit-
you know what? i dont think i know how to use those coords
does anyone know how to use them?

[talcumpowder]

It helps if you close the image tag. It also helps if you define the height and width.

CODE

<img src="http://img.photobucket.com/albums/v236/simplestar/eternal%20ro/meandhimbg2.jpg"; border="0" height="500" width="600" usemap="#mymap">

Change the height and width to the actual height and width of your image.