Op zich werkt dit goed alleen als ik er een venster van maak binnen windows en deze verklein tot minder dan de breedte van 996 px (content) , schuift de box toch net nog een beetje naar rechts en dit vind ik jammer. wat kan ik hier aan doen, ben nog niet zo ervaren met css, dus alle tips zijn welkom.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Naamloos document</title>
<style>
DIV {overflow: hidden;}
body {
padding: 0;
margin: 0;
width: 100%;
height:820;
display: table;
background-color: #ffffff;
background-image: url(achtergrond.jpg);
background-repeat: no-repeat;
background-position: center -9px;
}
#content {
width: 996px;
height:800px;
margin: 0 auto 0;
overflow: hidden;
}
#box1 {
position:relative;
left: 560px;
height: 196px;
width: 280px;
text-align: right;
top: 188px;
border-top-style: dotted;
border-right-style: dotted;
border-bottom-style: dotted;
border-left-style: dotted;
border-top-color: #F00;
border-right-color: #F00;
border-bottom-color: #F00;
border-left-color: #F00;
}
</style>
</head>
<body>
<div id="content">
<div id="box1">
<ul id="menu2">
<br /><a href="#">test1<span class="text"><br /> bericht1</span>
</a><br />
<a href="#">test2<span class="text"><br /> bericht2</span>
</a><br />
<a href="#">test3<span class="text"><br /> bericht3</span>
</a><br />
</ul></div>
</div>
</body>
</html>
