Cuerpo de esta web

Vercceti · #1 (**permalink**) 23/10/2008, 10:39

Muy buenas.

Me gustaría saber cómo hacer un cuerpo similar al de esta web.

Para que quede más claro que parte quiero, he subido una captura.

Me da igual el código que utilicéis, pero yo querré incluir todo tipo de contenido dentro de ese cuerpo. Quiero que tenga una anchura de 900px.

Muchísimas gracias.

America|UNK · #2 (**permalink**) 23/10/2008, 14:15

Código HTML:

<!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=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
</head>
<style type="text/css">
table, td, th {border:none; padding::0px}
body {color:#FF0000; font:normal 8pt Arial; margin:0px; padding::0px}
#main {margin: 0pt auto; width:900px}
#main table {width:100%; height:100%; border-collapse:collapse;}
.menu1 {background:#000;color:#FFF; height:35px; }
.menu2 {background:#CC0000;color:#FFF;height:35px; }

.white {background:#fff;}
.red {background:#CC0000; color:#FFF;}
.black {background:#000;}
.orange {background:#FF6600;}

.v {width:400px;}
.small {width: 250px;}
.rght {background:#666; width:250px}
.img2 {width:250px}

.reviews {height:400px;}
.news {height:150px;}
</style>
<body>
<div id="main">
  <table>
    <tr>
      <td colspan="3" class="menu1"><div>Menu  - Menu - Menu  - Menu - Menu  - Menu</div></td>
    </tr>
    <tr>
      <td colspan="3" class="menu2"><div>Menu2  - Menu - Menu  - Menu - Menu  - Menu</div></td>
    </tr>
    <tr>
      <td class="small">img</td>
      <td colspan="2">ad</td>
    </tr>
    <tr>
      <td colspan="2">
	  	<table class="reviews">
          <tr>
            <td rowspan="2" height="100%" class="black" valign="top">IMG</td>
            <td class="white small news" valign="top">IMG2</td>
          </tr>
          <tr>
            <td class="orange small news" valign="top">IMG2</td>
          </tr>
        </table> </td>
      <td rowspan="2" class="rght" valign="top">rght</td>
    </tr>
    <tr>
      <td class="small" valign="top"><div class="red">OUT NOW</div>
        <div>List 1</div>
        <div>List 2</div>
        <div>List 3</div>
        <div>List 4</div>
        <div class="red">COMING SOON</div>
        <div>List 1</div>
        <div>List 2</div>
        <div>List 3</div>
        <div>List 4</div></td>
      <td valign="top" class="v">
	  <div>Videos</div>
	  <div>Videos</div>
	  <div>Videos</div>
	  <div>Videos</div>
	  <div>Videos</div>
      <div>Videos</div>      
      <div>Videos</div>
      <div>Videos</div>
      <div>Videos</div>
      <div>Videos</div>
      <div>Videos</div>
      <div>Videos</div>
      <div>Videos</div>
      <div>Videos</div>
      <div>Videos</div>
      <div>Videos</div>
      <p>&nbsp;</p></td>
    </tr>
  </table>
</div>
</body>
</html>

Sin pensarlo se han pasado 14 minutos -.-, pruebalo no lo e visto aun en IE, pero en Firefox va bien.

Vercceti · #3 (**permalink**) 23/10/2008, 15:10

Impresionantemente perfecto. Muchísimas gracias, te lo has currado, de verdad.