Jump to content

[SOLVED] positioning images does not work


sqlnoob

Recommended Posts

OK back again. I'd tried a different approach this time.

 

Again the images are displayed fine in quircks mode with IE6, but as soon as I open the page with firefox it gives me troubles.

 

Setting a DTD to for example: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

will make it worse, because then the page doesn't display the images in IE6 as it should be and will give the same troubles as if you opened it in Firefox.

 

here is the link to the page:

http://www.shugo.nl/draft/newsengoku.htm

 

The stylesheet is internal so that you can also see in the source of the css.

 

I've looked at positioning divs with this tutorial.

http://css-resources.com/Div-Box-Positioning-with-Absolute-and-Relative-Positioning.html

 

and quircks mode works both fine for FF and IE there, but it only explains divs and not images or image links.

 

I'm really beggining to think that positioning images or image links is not supported in firefox and the new css recommendations.

Link to comment
Share on other sites

I got it working somewhat decently like this:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>shugo map</title>
<meta name="keywords" content="map japan">
<style type="text/css">
.mappage .mappage img, a { border: 0; margin: 0; border: 0; padding: 0; position: absolute; } 
body {background-color: #000000;}
div.mappage {background-color: #00ffff; position: relative; }
img.minimap {position:absolute; left: 410px; top:0px;}
img.m1 {left:0px; top:0px;}
img.m2 {left:40px; top:0px;}
img.m3 {left:80px; top:0px;}
img.m4 {left:120px; top:0px;}
img.m5 {left:160px; top:0px;}
img.m6 {left:200px; top:0px;}
img.m7 {left:240px; top:0px;}
img.m8 {left:280px; top:0px;}
img.m9 {left:320px; top:0px;}
img.m10 {left:360px; top:0px;}
img.m11 {left:0px; top:40px;}
img.m12 {left:40px; top:40px;}
img.m13 {left:80px; top:40px;}
img.m14 {left:120px; top:40px;}
img.m15 {left:160px; top:40px;}
img.m16 {left:200px; top:40px}
img.m17 {left:240px; top:40px}
img.m18 {left:280px; top:40px}
img.m19 {left:320px; top:40px}
img.m20 {left:360px; top:40px}
img.m21 {left:0px; top:80px}
img.m22 {left:40px; top:80px}
img.m23 {left:80px; top:80px}
img.m24 {left:120px; top:80px}
img.m25 {left:160px; top:80px}
img.m26 {left:200px; top:80px}
img.m27 {left:240px; top:80px}
img.m28 {left:280px; top:80px}
img.m29 {left:320px; top:80px}
img.m30 {left:360px; top:80px}
img.m31 {left:0px; top:120px}
img.m32 {left:40px; top:120px}
img.m33 {left:80px; top:120px}
img.m34 {left:120px; top:120px}
img.m35 {left:160px; top:120px}
img.m36 {left:200px; top:120px}
img.m37 {left:240px; top:120px}
img.m38 {left:280px; top:120px}
img.m39 {left:320px; top:120px}
img.m40 {left:360px; top:120px}
img.m41 {left:0px; top:160px}
img.m42 {left:40px; top:160px}
img.m43 {left:80px; top:160px}
img.m44 {left:120px; top:160px}
img.m45 {left:160px; top:160px}
img.m46 {left:200px; top:160px}
img.m47 {left:240px; top:160px}
img.m48 {left:280px; top:160px}
img.m49 {left:320px; top:160px}
img.m50 {left:360px; top:160px}
img.m51 {left:0px; top:200px}
img.m52 {left:40px; top:200px}
img.m53 {left:80px; top:200px}
img.m54 {left:120px; top:200px}
img.m55 {left:160px; top:200px}
img.m56 {left:200px; top:200px}
img.m57 {left:240px; top:200px}
img.m58 {left:280px; top:200px}
img.m59 {left:320px; top:200px}
img.m60 {left:360px; top:200px}
img.m61 {left:0px; top:240px}
img.m62 {left:40px; top:240px}
img.m63 {left:80px; top:240px}
img.m64 {left:120px; top:240px}
img.m65 {left:160px; top:240px}
img.m66 {left:200px; top:240px}
img.m67 {left:240px; top:240px}
img.m68 {left:280px; top:240px}
img.m69 {left:320px; top:240px}
img.m70 {left:360px; top:240px}
img.m71 {left:0px; top:280px}
img.m72 {left:40px; top:280px}
img.m73 {left:80px; top:280px}
img.m74 {left:120px; top:280px}
img.m75 {left:160px; top:280px}
img.m76 {left:200px; top:280px}
img.m77 {left:240px; top:280px}
img.m78 {left:280px; top:280px}
img.m79 {left:320px; top:280px}
img.m80 {left:360px; top:280px}
img.m81 {left:0px; top:320px}
img.m82 {left:40px; top:320px}
img.m83 {left:80px; top:320px}
img.m84 {left:120px; top:320px}
img.m85 {left:160px; top:320px}
img.m86 {left:200px; top:320px}
img.m87 {left:240px; top:320px}
img.m88 {left:280px; top:320px}
img.m89 {left:320px; top:320px}
img.m90 {left:360px; top:320px}
img.m91 {left:0px; top:360px}
img.m92 {left:40px; top:360px}
img.m93 {left:80px; top:360px}
img.m94 {left:120px; top:360px}
img.m95 {left:160px; top:360px}
img.m96 {left:200px; top:360px}
img.m97 {left:240px; top:360px}
img.m98 {left:280px; top:360px}
img.m99 {left:320px; top:360px}
img.m100 {left:360px; top:360px}
</style>
</head>
<body>
<div class="mappage">
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m1"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m2"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m3"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m4"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m5"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m6"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m7"></a>

<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m8"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m9"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m10"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m11"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m12"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m13"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m14"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m15"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m16"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m17"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m18"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m19"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m20"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m21"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m22"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m23"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m24"></a>

<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m25"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m26"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m27"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m28"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m29"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m30"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m31"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m32"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m33"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m34"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m35"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m36"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m37"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m38"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m39"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m40"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m41"></a>

<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m42"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m43"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m44"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m45"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m46"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m47"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m48"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m49"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m50"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m51"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m52"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m53"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m54"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m55"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m56"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m57"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m58"></a>

<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m59"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m60"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m61"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m62"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m63"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m64"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m65"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m66"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m67"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m68"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m69"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m70"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m71"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m72"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m73"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m74"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m75"></a>

<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m76"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m77"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m78"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m79"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m80"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m81"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m82"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m83"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m84"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m85"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m86"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m87"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m88"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m89"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m90"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m91"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m92"></a>

<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m93"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m94"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m95"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m96"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m97"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m98"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m99"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m100"></a>
<img src="http://www.shugo.nl/draft/mininihon.gif" width="300" height="400" class="minimap" usemap="#minimap" alt="minimap">
<map name="minimap">
<area shape="rect" href="http://www.shugo.nl" coords="223,128,227,133" alt="test" title="test">
</map>
</div>
</body>
</html>

Differences between your code and that.

Classes can't start with a number, they ALWAYS needs to start with a letter, after that you're free to use numbers. (this is what made firefox ignore the classes completely)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> Doctypes.. ALWAYS use them or you're writing gibberish by default.

Lowercase HTML, not sure if that is actually required with html 4.01 .. think it's xhtml, but mweh..

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> unless you're putting out the encoding via header() already, browsers will fall back to whatever default encoding they have set (PS: IE doesn't understand encoding headers.. so you'll still need the meta tag for it)

position absolute moved to .mappage img{}  as repeating the same thing for 50'ish classes just adds bloat.

Link to comment
Share on other sites

sorry but that doesn't work at all, now only 1 of the grid pictures displays, not all 100 of them. It supposed to be a 10 by 10 grid with all of the 100 pictures neatly packed together.

 

hmm I guess firebug is just no good at displaying these things

 

it will just have to suffice with some room between the image links i guess, it doesn't look as pretty but at least it works somewhat.

Link to comment
Share on other sites

oops my bad, copied over the wrong version, this oughta do better.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>shugo map</title>
<meta name="keywords" content="map japan">
<style type="text/css">
.mappage a img {  margin: 0; padding: 0; position: absolute; border: 0; } 
body {background-color: #000000;}
div.mappage {background-color: #00ffff; position: relative; }
img.minimap {position:absolute; left: 410px; top:0px;}
img.m1 {left:0px; top:0px;}
img.m2 {left:40px; top:0px;}
img.m3 {left:80px; top:0px;}
img.m4 {left:120px; top:0px;}
img.m5 {left:160px; top:0px;}
img.m6 {left:200px; top:0px;}
img.m7 {left:240px; top:0px;}
img.m8 {left:280px; top:0px;}
img.m9 {left:320px; top:0px;}
img.m10 {left:360px; top:0px;}
img.m11 {left:0px; top:40px;}
img.m12 {left:40px; top:40px;}
img.m13 {left:80px; top:40px;}
img.m14 {left:120px; top:40px;}
img.m15 {left:160px; top:40px;}
img.m16 {left:200px; top:40px}
img.m17 {left:240px; top:40px}
img.m18 {left:280px; top:40px}
img.m19 {left:320px; top:40px}
img.m20 {left:360px; top:40px}
img.m21 {left:0px; top:80px}
img.m22 {left:40px; top:80px}
img.m23 {left:80px; top:80px}
img.m24 {left:120px; top:80px}
img.m25 {left:160px; top:80px}
img.m26 {left:200px; top:80px}
img.m27 {left:240px; top:80px}
img.m28 {left:280px; top:80px}
img.m29 {left:320px; top:80px}
img.m30 {left:360px; top:80px}
img.m31 {left:0px; top:120px}
img.m32 {left:40px; top:120px}
img.m33 {left:80px; top:120px}
img.m34 {left:120px; top:120px}
img.m35 {left:160px; top:120px}
img.m36 {left:200px; top:120px}
img.m37 {left:240px; top:120px}
img.m38 {left:280px; top:120px}
img.m39 {left:320px; top:120px}
img.m40 {left:360px; top:120px}
img.m41 {left:0px; top:160px}
img.m42 {left:40px; top:160px}
img.m43 {left:80px; top:160px}
img.m44 {left:120px; top:160px}
img.m45 {left:160px; top:160px}
img.m46 {left:200px; top:160px}
img.m47 {left:240px; top:160px}
img.m48 {left:280px; top:160px}
img.m49 {left:320px; top:160px}
img.m50 {left:360px; top:160px}
img.m51 {left:0px; top:200px}
img.m52 {left:40px; top:200px}
img.m53 {left:80px; top:200px}
img.m54 {left:120px; top:200px}
img.m55 {left:160px; top:200px}
img.m56 {left:200px; top:200px}
img.m57 {left:240px; top:200px}
img.m58 {left:280px; top:200px}
img.m59 {left:320px; top:200px}
img.m60 {left:360px; top:200px}
img.m61 {left:0px; top:240px}
img.m62 {left:40px; top:240px}
img.m63 {left:80px; top:240px}
img.m64 {left:120px; top:240px}
img.m65 {left:160px; top:240px}
img.m66 {left:200px; top:240px}
img.m67 {left:240px; top:240px}
img.m68 {left:280px; top:240px}
img.m69 {left:320px; top:240px}
img.m70 {left:360px; top:240px}
img.m71 {left:0px; top:280px}
img.m72 {left:40px; top:280px}
img.m73 {left:80px; top:280px}
img.m74 {left:120px; top:280px}
img.m75 {left:160px; top:280px}
img.m76 {left:200px; top:280px}
img.m77 {left:240px; top:280px}
img.m78 {left:280px; top:280px}
img.m79 {left:320px; top:280px}
img.m80 {left:360px; top:280px}
img.m81 {left:0px; top:320px}
img.m82 {left:40px; top:320px}
img.m83 {left:80px; top:320px}
img.m84 {left:120px; top:320px}
img.m85 {left:160px; top:320px}
img.m86 {left:200px; top:320px}
img.m87 {left:240px; top:320px}
img.m88 {left:280px; top:320px}
img.m89 {left:320px; top:320px}
img.m90 {left:360px; top:320px}
img.m91 {left:0px; top:360px}
img.m92 {left:40px; top:360px}
img.m93 {left:80px; top:360px}
img.m94 {left:120px; top:360px}
img.m95 {left:160px; top:360px}
img.m96 {left:200px; top:360px}
img.m97 {left:240px; top:360px}
img.m98 {left:280px; top:360px}
img.m99 {left:320px; top:360px}
img.m100 {left:360px; top:360px}
</style>
</head>
<body>
<div class="mappage">
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m1"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m2"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m3"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m4"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m5"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m6"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m7"></a>

<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m8"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m9"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m10"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m11"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m12"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m13"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m14"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m15"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m16"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m17"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m18"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m19"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m20"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m21"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m22"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m23"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m24"></a>

<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m25"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m26"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m27"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m28"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m29"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m30"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m31"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m32"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m33"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m34"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m35"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m36"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m37"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m38"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m39"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m40"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m41"></a>

<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m42"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m43"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m44"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m45"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m46"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m47"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m48"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m49"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m50"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m51"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m52"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m53"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m54"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m55"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m56"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m57"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m58"></a>

<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m59"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m60"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m61"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m62"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m63"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m64"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m65"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m66"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m67"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m68"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m69"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m70"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m71"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m72"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m73"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m74"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m75"></a>

<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m76"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m77"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m78"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m79"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m80"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m81"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m82"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m83"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m84"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m85"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m86"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m87"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m88"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m89"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m90"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m91"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m92"></a>

<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m93"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m94"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m95"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m96"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m97"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m98"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain2.gif" width="40" height="40" alt="pic" class="m99"></a>
<a href="http://www.shugo.nl"><img src="http://www.shugo.nl/draft/terrain1.gif" width="40" height="40" alt="pic" class="m100"></a>
<img src="http://www.shugo.nl/draft/mininihon.gif" width="300" height="400" class="minimap" usemap="#minimap" alt="minimap">
<map name="minimap">
<area shape="rect" href="http://www.shugo.nl" coords="223,128,227,133" alt="test" title="test">
</map>
</div>
</body>
</html>

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.