[Ovillo] altura scroll

Vie Mayo 5 04:58:01 UTC 2006

Hola

estoy maquetando las páginas de una aplicación que consta de cabecera y
cuerpo de página.
En la cabecera va el titular de la sección, de longitud variable ya que lo
introduce el usuario,  y la botonadura.
El cuerpo de página puede ser muy extenso, por lo que la idea es que tenga
un scroll vertical, permaneciendo fija la cabecera.

Bueno, la maquetación básica de este planteamiento es la siguiente:

*respecto a los estilos:*

<style>
  body{height:100%;padding:0;margin:0;}
/*capa que contiene tanto la cabecera como el cuerpo*/

.scrollerContent{background-color:#ff0000;height:99%;width:99%;position:absolute;}
.dsScrollerContent{width:99%;height:80%;overflow:auto;background-color:#0000ff;}
   .header{height:20%;overflow:visible;}
</style>

*respecto  al html:*

<body scroll="no">

<div class="scrollerContent">
  <div class="header">
  <table cellpadding="0" cellspacing="0" border="1" width="100%">
  <colgroup width="50%"></colgroup><colgroup width="50%"></colgroup>
   <tr>
    <td>cabecera1</td>
    <td>cabecera2</td>
   </tr>
  </table>
     <p>afasdfas</p>
     <p>asfdasfas</p>
     <p>asfasfda</p>
     <p>asfdasdf</p>
     <p>asfd</p>
  </div>
 <div class="dsScrollerContent">
  <table cellpadding="0" cellspacing="0" border="1" width="100%">
  <colgroup width="50%"></colgroup><colgroup width="50%"></colgroup>
   <tr>
    <td>sgsgsgs</td>
    <td>afafa</td>
   </tr>
  </table>
  afasfasf<br /> afasfasf<br /> afasfasf<br /> afasfasf<br />afasfasf<br
/>afasfasf<br />
  afasfasf<br /> afasfasf<br /> afasfasf<br /> afasfasf<br />afasfasf<br
/>afasfasf<br />afasfasf<br /> afasfasf<br /> afasfasf<br /> afasfasf<br
/>afasfasf<br />afasfasf<br />
  afasfasf<br /> afasfasf<br /> afasfasf<br /> afasfasf<br />afasfasf<br
/>afasfasf<br />
  afasfasf<br /> afasfasf<br /> afasfasf<br /> afasfasf<br />afasfasf<br
/>afasfasf<br />afasfasf<br /> afasfasf<br /> afasfasf<br /> afasfasf<br
/>afasfasf<br />afasfasf<br />
  afasfasf<br /> afasfasf<br /> afasfasf<br /> afasfasf<br />afasfasf<br
/>afasfasf<br />
  afasfasf<br /> afasfasf<br /> afasfasf<br /> afasfasf<br />afasfasf<br
/>afasfasf<br />afasfasf<br /> afasfasf<br /> afasfasf<br /> afasfasf<br
/>afasfasf<br />afasfasf<br />
  afasfasf<br /> afasfasf<br /> afasfasf<br /> afasfasf<br />afasfasf<br
/>afasfasf<br />
  afasfasf<br /> afasfasf<br /> afasfasf<br /> afasfasf<br />afasfasf<br
/>afasfasf<br />afasfasf<br /> afasfasf<br /> afasfasf<br /> afasfasf<br
/>afasfasf<br />afasfasf<br />
  afasfasf<br /> afasfasf<br /> afasfasf<br /> afasfasf<br />afasfasf<br
/>afasfasf<br />
  afasfasf<br /> afasfasf<br /> afasfasf<br /> afasfasf<br />afasfasf<br
/>afasfasf<br />afasfasf<br /> afasfasf<br /> afasfasf<br /> afasfasf<br
/>afasfasf<br />afasfasf<br />
 </div>
</div>
</body>