Problema Com O 'float:' ?

bom... vamos lá então.

<?xml version="1.0"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR...l1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Samuca.Net</title>
<meta name="keywords" content="samuca" />
<meta name="description" content="samuca.net web design e fotografia" />
<style type="text/css" media="all">@import url(css/main.css);</style>
<style type="text/css" media="all">@import url(css/index.css);</style>

</head>
<body>
<div id="estrutura_main">
<div id="estrutura_topo"></div>
<div id="topo_fotos"></div>
<div id="menu">inicial - webdesign - fotografia - tutoriais - links - contato </div>
<div id="conteudo"><style type="text/css" media="all">@import url(../css/index.css);</style>
<div id="bloco_esquerda">
<div id="sobre_mim">
sobre mim
</div>

</div>
<div id="bloco_direita">
<div id="webmail">
web mail
</div>
<div id="calendario">
calendario
</div>
</div></div>
<div id="estrutura_baixo"></div>
<div id="rodape"><a href="http://jigsaw.w3.org...usermedium=all" target="_blank">css</a> | <a href="http://www.tableless...">tableless</a> | <a href="http://validator.w3....www.samuca.net" target="_blank">xhtml</a><br>

Todos os Direitos Reservados ® 2005 Samuca.Net</div>
</div>
</body>
</html>

/* global
----------------------------------------------- */
body {
padding:10px;
background:#f6f6f6 url(../images/bg.gif);
}
/* layout
----------------------------------------------- */
#estrutura_main {
width:700px;
position:absolute;
left:50%;
margin-left:-350px;
background-color:#ffffff;
}
#estrutura_topo {
width: 700px;
height: 10px;
background-image: url(../images/bg_topo.gif);
background-repeat: no-repeat;
background-position:top;
background-color:#FFFFFF;
position: relative;
}
#topo_fotos{
width: 700px;
height: 300px;
background-image:url(../images/foto.png);
background-repeat: no-repeat;
background-color:#FFFFFF;
background-position:center;
vertical-align:middle;
position: relative;
text-align:center;
}
#menu{
width: 680px;
height: 30px;
margin-left:10px;
margin-top:5px;
padding-top:5px;
background-image:url(../images/bg_menu.gif);
background-position:cente, top;
background-color:#ffffff;
background-repeat: no-repeat;
position: relative;
text-align:center;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#505050;
}

/* CONTEÚDO */
#conteudo {
width:700px;
position:relative;
background-color:#ffffff;
text-align:center;
}
/* -- */

#estrutura_baixo {
width: 700px;
height: 10px;
background-image: url(../images/bg_baixo.gif);
background-repeat: no-repeat;
background-position:bottom;
background-color:#FFFFFF;
position: relative;
}
#rodape{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
text-align:center;
color:#dedede;
padding-top:5px;
text-decoration:none;
background-image:url(../images/bg.gif);
}
#rodape a{text-decoration:none; color:#dedede;}
#rodape a:hover{text-decoration:underline; color:#dedede;}

-- ## --

<style type="text/css" media="all">@import url(../css/index.css);</style>
<div id="bloco_esquerda">
<div id="sobre_mim">
sobre mim
</div>
</div>
<div id="bloco_direita">
<div id="webmail">
web mail
</div>
<div id="calendario">
calendario
</div>
</div>

/* index
----------------------------------------------- */
#bloco_esquerda {
width:300px;
position:relative;
float:left;
background-color:#717171;
}
#bloco_direita {
width:300px;
position:relative;
float:right;
background-color:#dedede;
}

veja se isso ajuda