se7en.hu
29 Sep 2008, 09:46 AM
Hey guys, So I got these wierd gaps coming up. See code and screenshot below. Im sure its something simple, but I've been trying for a while and cant work it out.
Thanks
<div id="box">
<div id="heading"></div>
<div id="btns-1">
<a href="pamper.html" onmouseover="document.pam.src='images/pamper-mo.png'" onmouseout="document.pam.src='images/pamper.png'">
<img src="images/pamper.png" name="pam" />
</a>
<a href="where.html" onmouseover="document.whe.src='images/where-mo.png'" onmouseout="document.whe.src='images/where.png'">
<img src="images/where.png" name="whe" />
</a>
<a href="groups.html" onmouseover="document.gro.src='images/groups-mo.png'" onmouseout="document.gro.src='images/groups.png'">
<img src="images/groups.png" name="gro" />
</a>
<a href="bookings.html" onmouseover="document.boo.src='images/bookings-mo.png'" onmouseout="document.boo.src='images/bookings.png'">
<img src="images/bookings.png" name="boo" />
</a>
</div>
<div id="btns-2">
<a href="jajawurrung.html" onmouseover="document.jaj.src='images/jajawurrung-mo.png'" onmouseout="document.jaj.src='images/jajawurrung.png'">
<img src="images/jajawurrung.png" name="jaj" />
</a>
<a href="luccini.html" onmouseover="document.luc.src='images/luccini-mo.png'" onmouseout="document.luc.src='images/luccini.png'">
<img src="images/luccini.png" name="luc" />
</a>
<a href="egan.html" onmouseover="document.ega.src='images/egan-mo.png'" onmouseout="document.ega.src='images/egan.png'">
<img src="images/egan.png" name="ega" />
</a>
<a href="reghetti.html" onmouseover="document.reg.src='images/reghetti-mo.png'" onmouseout="document.reg.src='images/reghetti.png'">
<img src="images/reghetti.png" name="reg" />
</a>
<a href="stanbridge.html" onmouseover="document.sta.src='images/stanbridge-mo.png'" onmouseout="document.sta.src='images/stanbridge.png'">
<img src="images/stanbridge.png" name="sta" />
</a>
<a href="tommy-farmer.html" onmouseover="document.tom.src='images/tommy-farmer-mo.png'" onmouseout="document.tom.src='images/tommy-farmer.png'">
<img src="images/tommy-farmer.png" name="tom" />
</a>
</div>
<div id="photo-gallery"><img src="images/photo-gallery.png" /></div>
</div>
@charset "UTF-8";
/* CSS Document */
body {
background:#ffffff;
margin:0px;
padding:0px;
}
#box {
width:934px;
margin:auto;
}
/* main divs */
#heading {
position:absolute;
margin:50px 0px 0px 0px;
width:206px;
height:182px;
background:url(../images/heading.png) no-repeat;
}
#btns-1 {
position:absolute;
margin:50px 0px 0px 206px;
width:728px;
height:584px;
}
#btns-2 {
position:absolute;
margin:232px 0px 0px 0px;
width:206px;
height:189px;
}
#photo-gallery {
position:absolute;
margin:421px 0px 0px 0px;
width:206px;
height:213px;
}
Screenshot (http://localhostr.com/files/9639e2/Picture+1.png)
Thanks
<div id="box">
<div id="heading"></div>
<div id="btns-1">
<a href="pamper.html" onmouseover="document.pam.src='images/pamper-mo.png'" onmouseout="document.pam.src='images/pamper.png'">
<img src="images/pamper.png" name="pam" />
</a>
<a href="where.html" onmouseover="document.whe.src='images/where-mo.png'" onmouseout="document.whe.src='images/where.png'">
<img src="images/where.png" name="whe" />
</a>
<a href="groups.html" onmouseover="document.gro.src='images/groups-mo.png'" onmouseout="document.gro.src='images/groups.png'">
<img src="images/groups.png" name="gro" />
</a>
<a href="bookings.html" onmouseover="document.boo.src='images/bookings-mo.png'" onmouseout="document.boo.src='images/bookings.png'">
<img src="images/bookings.png" name="boo" />
</a>
</div>
<div id="btns-2">
<a href="jajawurrung.html" onmouseover="document.jaj.src='images/jajawurrung-mo.png'" onmouseout="document.jaj.src='images/jajawurrung.png'">
<img src="images/jajawurrung.png" name="jaj" />
</a>
<a href="luccini.html" onmouseover="document.luc.src='images/luccini-mo.png'" onmouseout="document.luc.src='images/luccini.png'">
<img src="images/luccini.png" name="luc" />
</a>
<a href="egan.html" onmouseover="document.ega.src='images/egan-mo.png'" onmouseout="document.ega.src='images/egan.png'">
<img src="images/egan.png" name="ega" />
</a>
<a href="reghetti.html" onmouseover="document.reg.src='images/reghetti-mo.png'" onmouseout="document.reg.src='images/reghetti.png'">
<img src="images/reghetti.png" name="reg" />
</a>
<a href="stanbridge.html" onmouseover="document.sta.src='images/stanbridge-mo.png'" onmouseout="document.sta.src='images/stanbridge.png'">
<img src="images/stanbridge.png" name="sta" />
</a>
<a href="tommy-farmer.html" onmouseover="document.tom.src='images/tommy-farmer-mo.png'" onmouseout="document.tom.src='images/tommy-farmer.png'">
<img src="images/tommy-farmer.png" name="tom" />
</a>
</div>
<div id="photo-gallery"><img src="images/photo-gallery.png" /></div>
</div>
@charset "UTF-8";
/* CSS Document */
body {
background:#ffffff;
margin:0px;
padding:0px;
}
#box {
width:934px;
margin:auto;
}
/* main divs */
#heading {
position:absolute;
margin:50px 0px 0px 0px;
width:206px;
height:182px;
background:url(../images/heading.png) no-repeat;
}
#btns-1 {
position:absolute;
margin:50px 0px 0px 206px;
width:728px;
height:584px;
}
#btns-2 {
position:absolute;
margin:232px 0px 0px 0px;
width:206px;
height:189px;
}
#photo-gallery {
position:absolute;
margin:421px 0px 0px 0px;
width:206px;
height:213px;
}
Screenshot (http://localhostr.com/files/9639e2/Picture+1.png)