Mondi su mondi, sistemi di sistemi.

Posizionamenti assoluti multipli: come sfruttarli

Si tende a dimen­ti­care (tra­du­zione: non lo sapevo e non ci sarei mai arri­vato) che è pos­si­bile spe­ci­fi­care più di una “coor­di­nata” quando il posi­zio­na­mento è asso­luto; il bro­w­ser – tranne IE5 e IE6 – si pre­oc­cu­perà poi di ride­men­sio­nare l’elemento. Ad es:


#main {
  position: absolute;
  top: 20px;
  left: 20px;
  right: 20px;
  bottom: 20px;
}

porta ad avere un ele­mento che occupa tutto lo spa­zio a dispo­si­zione all’interno del suo geni­tore, lasciando 20px di spa­zio sui quat­tro lati.

È pos­si­bile sfrut­tare que­sta carat­te­ri­stica per creare un lay­out con un colon­nino a lar­ghezza fissa con la barra di scrol­ling e una sezione cen­trale, con lo scrol­ling, che si adatti alla lar­ghezza della pagina.

In que­sto arti­colo su “A List Apart” tro­vate tutti i det­ta­gli, com­preso come risol­vere la que­stione sotto IE5/6 sfrut­tan­done le peculiarità.

Per proseguire

Commenti e trackback sono disabilitati.