Hoi, ik ben mijn site aan het optimaliseren voor google en ben een probleempje tegengekomen.
Al mijn div's floaten, maar bij het menu zou mijn rechter div moeten floaten naast mijn tekst en naast een afbeelding die eronder staat. maar zoals je op deze link kan zien, is dit niet zo: http://users.skynet.be/jellepunk/huh/template.html
voor het gemak heb je hier mijn html bestand en css bestand
HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Sample This - 25 februari 2006</title>
<link rev="made" href="mailto:info@sample-this.be"/>
<meta http-equiv="Content-Type" content="txt/html; charset=iso-8859-1" />
<link href="style.css" rel="stylesheet" type="text/css" />
<script type="text/JavaScript">
<!--
function MM_openlineWindow(theURL,winName,features) { //v2.0
window.open(theURL,winName,features);
}
//-->
</script>
</head>
<body>
<!-- Meta info voor zoekrobots -->
<div id="meta_info">
<h1>Sample This!</h1> gaat door op 25 februari 2006 in DieZie te Roeselare<br/>
Er zijn optredens van Los Putas, The Apers, Core Of Anger, The Unarmed en Full Force Overdose<br/>
http://www.sample-this.be
</div>
<div id="container">
<!-- Divs voor achtergrond afbeeldingen -->
<div id="top">
</div>
<div id="menu_links">
</div>
<!-- menu -->
<div id="menu_tekst">
<a href="news.html"> News</a> | <a href="info.html">Info</a> | <a href="lineup.html">Line up</a> | <a href="media.html">media</a> | <a href="sponsors.html">Sponsors</a> | <a href="#" onclick="MM_openBrWindow('http://www.a-free-guestbook.com/guestbook.php?username=samplethis','Guestbook','scrollbars=yes,width=640,height=480')">Guestbook</a>
</div>
<!-- Divs voor achtergrond afbeeldingen -->
<div id="menu_onder">
</div>
<div id="menu_rechts">
</div>
<div id="boord_links">
</div>
<!-- Inhoud van de site -->
<div id="text">
</div>
<!-- Divs voor achtergrond afbeeldingen -->
<div id="boord_rechts">
</div>
<div id="onderkant">
</div>
</div>
</body>
</html>
Code:
#container{
position: relative;
margin-left: auto;
margin-right: auto;
width: 640px;
overflow: visible;
}
#meta_info{
display: none;
}
/* Position */
/* top */
#top{
float: left;
clear: both;
width: 640px;
height: 154px;
background-image:url(images/layout/top.gif);
}
/* menu */
#menu_links{
background-image:url(images/layout/menu_links.gif);
width: 118px;
height: 65px;
float: left;
}
#menu_tekst{
float: left;
width: 332px;
padding: 2px;
text-align: center;
background-color: #351B01;
}
#menu_onder{
float: left;
width: 337px;
height: 48px;
background-image:url(images/layout/menu_onder.gif);
}
#menu_rechts{
clear: none;
background-image:url(images/layout/menu_rechts.gif);
float: left;
width: 185px;
height: 65px;
}
/* body */
#boord_links{
float: left;
width: 118px;
height: 258px;
background-image:url(images/layout/boord_links.gif);
}
#text{
float: left;
width: 370px;
height: 248px;
padding: 5px;
background-color:#DF7E21;
overflow: auto;
}
#boord_rechts{
float: left;
width: 142px;
height: 258px;
background-image:url(images/layout/boord_rechts.gif);
}
/* bottom */
#onderkant{
clear: both;
float: left;
width: 640px;
height: 126px;
background-image: url('images/layout/onderkant.gif');
}
/* index */
#index{
position: absolute;
width: 600px;
height: 450px;
top: 50%;
left: 50%;
margin-top: -200px;
margin-left: -300px;
}
/* Layout */
body{
margin: 0px;
padding: 0px;
background-color: #351B01;
color: #ffffff;
font-family: verdana, tahoma;
font-size: 11px;
scrollbar-base-color: #DF7E21;
scrollbar-face-color: #DF7E21;
scrollbar-track-color: #DF7E21;
scrollbar-arrow-color: #330033;
scrollbar-highlight-color: #DF7E21;
scrollbar-3dlight-color: #DF7E21;
scrollbar-shadow-color: #DF7E21;
scrollbar-darkshadow-color: #DF7E21;
}
img{
border: none;
margin: 0px;
}
div{
margin: 0px;
padding: 0px;
border: 0px;
}
a, a:visited{
color: #FFFFFF;
text-decoration: underline;
}
a:hover{
text-decoration: none;
}
.center{
text-align: center;
}
.subscript{
font-style: italic;
font-size: 10px;
}
ul{
list-style-type: none;
}
h1{
font-size: 18px;}
.links{
position: relative;
margin-left:-40px;}
.sponsor{
margin-bottom: -10px;
}
.center{
text-align: center;
}
.klikken{
font-size: 8px;}