Diferència entre revisions de la pàgina «CSS posicionament»

De Cacauet Wiki
Salta a la navegació Salta a la cerca
m
m
Línia 70: Línia 70:
 
|-
 
|-
 
! scope="row" | Fix<br>  
 
! scope="row" | Fix<br>  
| Posició fixa al navegador, típicament per fer aparèixer finestres emergents.<br>  
+
| Posició fixa al navegador, no es mourà inclús si fem un ''scroll''. S'utilitza típicament per fer aparèixer finestres emergents.<br>  
 
| ''position: fixed;''  
 
| ''position: fixed;''  
 
| <br>
 
| <br>

Revisió del 18:47, 5 març 2011

En CSS podem trobar diferents tipus de posicionament:

  • Normal (static)
  • Absolut
  • Flotant
  • Fix


Modes de poscionament

Mode de

posicionament

Descripció
Propietat  CSS mode
Propietats CSS per alineació
Normal (estàtic)

Segueix el que s'anomena "flux normal del text": d'esquerra a dreta i de dalt a baix.

Un bloc ocupa tota l'amplada del seu contenidor.

position: static;

margin: ...;

margin-left: ...; margin-right: ...; margin-top: ...; margin-bottom: ...;

Absolut

Es poden posicionar els blocs de manera absoluta respecte del contenidor.

El bloc contenidor portarà la propietat "relative".

El bloc a alinear portarà l

BLOC:

position: absolute;

CONTENIDOR:

position: relative;

top: 10px;

bottom:  2em;

left: 100px;

right: 5em;

Flotant
Per alinear blocs al voltant del text.

float: left;

float: right;


Fix
Posició fixa al navegador, no es mourà inclús si fem un scroll. S'utilitza típicament per fer aparèixer finestres emergents.
position: fixed;