Como fazer div central para preencher o espaço entre os elementos flutuantes?

Question

Mar 31, 2013, 12:34 AM

Como fazer div central para preencher o espaço entre os elementos flutuantes?

Eu tenho três elementos div: esquerda, meio e direita. Esquerda e direita são fixas e flutuantes. O que eu quero é odiv médio para preencher a lacuna entre eles.

Este é o meu código:

<!DOCTYPE html>
<html>
<head>
   <style>
      * {border: dotted 1px red;}
      #left {
         width: 200px;
         float: left;
      }
      #middle {
         float: left;
      }
      #right {
         width: 200px;
         float: right;
      }
   </style>
</head>
<body>
   <div id="left"  >  left   </div>
   <div id="middle">  middle </div>
   <div id="right" >  right  </div>
</body>
</html>

Algumas ideias em como fazer isso? Eu tentei soluções diferentes, mas não consegui fazer o que eu quero.