Hey jongens!
Ik werk sinds kort met div'jes, dus echt ervaren ben ik niet op dit gebied.
Het probleem is zoals de afbeelding weergeeft. De tekst komt schuin onder de hyperlinks te staan, wat ik niet wil.

Hieronder komt de broncode.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Welkom</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type ="text/css">
<!--
body {
position: relative;
background-color: #DDDDDD
}
.hoofdcontainer {
position: relative;
width: 900px;
padding: 10px;
margin-left: auto;
margin-right: auto;
}
.container {
border: none;
width: 900px;
padding: 10px;
margin-left: auto;
margin-right: auto;
vertical-align: middle;
}
.container2 {
position: relative;
border: 1px dashed #FF0000;
border: none;
width: 900px;
padding: 10px;
margin-left: auto;
margin-right: auto;
vertical-align: middle;
float: left;
}
.container3 {
position: relative;
vertical-align: top;
border: 1px dashed #FF0000;
width: 500px;
padding: 10px;
margin-left: 140px;
margin-right: 15px;
padding: 10px;
vertical-align: middle;
float: left;
}
.header {
border: none;
width: 900px;
height: 158px;
text-align: center;
vertical-align: middle;
margin-left: auto;
margin-right: auto;
margin-bottom: 1em;
padding: 0px;
position: relative;
background-image: url(topframe.png);
}
.linksboven {
border: none;
color: #000000;
text-align: center;
width: 150px;
height: 46px;
margin: 0px;
padding: 0px;
float: left;
background-image: url(hyperlinktopbar.png);
}
.menu {
border: none;
color: #000000;
text-align: center;
width: 113px;
height: 33px;
margin: 0px;
padding: 0px;
background-image:url(hyperlinkleft.png);
}
.rechtsboven {
border: none;
color: #000000;
text-align: center;
width: 150px;
height: 46px;
margin: 0px;
padding: 0px;
float: right;
background-image: url(hyperlinktopbar.png);
}
div.inhoud {
vertical-align: top;
top: 0px;
width: 500px;
height: auto;
float: right;
text-align:left;
}
a:link {
color: #EEDDEE;
} /*unvisited link */
a:hover {
text-decoration: none;
color:#CC6633
} /*link changes color when mouse over */
a:visited {
color: #993300
} /*visited link */
a:active {
color:#FF0000
} /*active link */
div.spacer {
clear: both
}
-->
</style>
</head>
<body>
<div class="hoofdcontainer">
<div class="container">
<div class="header"></div>
<div class="linksboven"></div>
<div class="linksboven"></div>
<div class="linksboven"></div>
<div class="rechtsboven"></div>
<div class="rechtsboven"></div>
<div class="rechtsboven"></div>
<div class="container2">
<div class="menu"><a href="index.htm">Home</a></div>
<div class="menu"><a href="#">Over het bedrijf</a></div>
<div class="menu"><a href="#">Stage</a></div>
</div>
</div>
</div>
</div>
</div>
</html>
Ik werk sinds kort met div'jes, dus echt ervaren ben ik niet op dit gebied.
Het probleem is zoals de afbeelding weergeeft. De tekst komt schuin onder de hyperlinks te staan, wat ik niet wil.

Hieronder komt de broncode.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Welkom</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type ="text/css">
<!--
body {
position: relative;
background-color: #DDDDDD
}
.hoofdcontainer {
position: relative;
width: 900px;
padding: 10px;
margin-left: auto;
margin-right: auto;
}
.container {
border: none;
width: 900px;
padding: 10px;
margin-left: auto;
margin-right: auto;
vertical-align: middle;
}
.container2 {
position: relative;
border: 1px dashed #FF0000;
border: none;
width: 900px;
padding: 10px;
margin-left: auto;
margin-right: auto;
vertical-align: middle;
float: left;
}
.container3 {
position: relative;
vertical-align: top;
border: 1px dashed #FF0000;
width: 500px;
padding: 10px;
margin-left: 140px;
margin-right: 15px;
padding: 10px;
vertical-align: middle;
float: left;
}
.header {
border: none;
width: 900px;
height: 158px;
text-align: center;
vertical-align: middle;
margin-left: auto;
margin-right: auto;
margin-bottom: 1em;
padding: 0px;
position: relative;
background-image: url(topframe.png);
}
.linksboven {
border: none;
color: #000000;
text-align: center;
width: 150px;
height: 46px;
margin: 0px;
padding: 0px;
float: left;
background-image: url(hyperlinktopbar.png);
}
.menu {
border: none;
color: #000000;
text-align: center;
width: 113px;
height: 33px;
margin: 0px;
padding: 0px;
background-image:url(hyperlinkleft.png);
}
.rechtsboven {
border: none;
color: #000000;
text-align: center;
width: 150px;
height: 46px;
margin: 0px;
padding: 0px;
float: right;
background-image: url(hyperlinktopbar.png);
}
div.inhoud {
vertical-align: top;
top: 0px;
width: 500px;
height: auto;
float: right;
text-align:left;
}
a:link {
color: #EEDDEE;
} /*unvisited link */
a:hover {
text-decoration: none;
color:#CC6633
} /*link changes color when mouse over */
a:visited {
color: #993300
} /*visited link */
a:active {
color:#FF0000
} /*active link */
div.spacer {
clear: both
}
-->
</style>
</head>
<body>
<div class="hoofdcontainer">
<div class="container">
<div class="header"></div>
<div class="linksboven"></div>
<div class="linksboven"></div>
<div class="linksboven"></div>
<div class="rechtsboven"></div>
<div class="rechtsboven"></div>
<div class="rechtsboven"></div>
<div class="container2">
<div class="menu"><a href="index.htm">Home</a></div>
<div class="menu"><a href="#">Over het bedrijf</a></div>
<div class="menu"><a href="#">Stage</a></div>
</div>
</div>
</div>
</div>
</div>
</html>