Repositionnement [resolu] |
Aller à la page Précédente 1, 2 |
| Voir le sujet précédent :: Voir le sujet suivant |
| Auteur |
Message |
SIBELIUS
html mioche
 |
 Repositionnement [resolu] , Posté le: 06-12-2004 14:55 |
|
|
| salemioche a écrit: |
tu definis ta position comme absolue et non relative donc ton div sera toujours a 211px a droite de la bordure gauche |
Attention, cette confusion est fréquente :
un élément positionné en absolu ne se place pas obligatoirement par rapport aux coins de la page mais par rapport au dernier ancêtre positionné.
En clair, si cet élément est contenu dans une autre balise positionnée, il se placera par rapport à cette balise et non par rapport au document.
Beaucoup ont cette méconnaissance et cela engendre beaucoup d'a-priori faux par rapport aux positions absolues.
http://www.alsacreations.com/articles/div/
| salemioche a écrit: |
tu ne peux pas definir de position ET avoir le recentrage, il y a conflit |
Voilà l'un des a-priori faux. Il est tout à fait possible de centrer un élément en position absolue (ou relative), tout simplement parce que les pixels ne sont pas la seule unité possible : les pourcentages permettent de rendre un site CSS très fluide.
Centrer avec des position absolues : http://www.alsacreations.com/articles/centrer/ |
|
|
SIBELIUS
html mioche
|
| Repositionnement [resolu] , Posté le: 06-12-2004 15:01 |
|
|
| Dany a écrit: |
en tout cas moi je capte rien au css, vive le bon vieu html a lancienne
 |
Les CSS sont presque aussi vieux que le HTML (apparus en même temps que HTML 2.0)  |
|
|
salemioche
salemioche
 |
| Repositionnement [resolu] , Posté le: 06-12-2004 15:08 |
|
|
| SIBELIUS a écrit: |
| salemioche a écrit: |
tu ne peux pas definir de position ET avoir le recentrage, il y a conflit |
Voilà l'un des a-priori faux. Il est tout à fait possible de centrer un élément en position absolue (ou relative), tout simplement parce que les pixels ne sont pas la seule unité possible : les pourcentages permettent de rendre un site CSS très fluide.
Centrer avec des position absolues : http://www.alsacreations.com/articles/centrer/ |
Oui mais si tu es obligé de mettre une couche de div intermédiaire.
.
______________________________________
creation site internet - Hébergement web - Agence Web |
|
|
SIBELIUS
html mioche
|
| Repositionnement [resolu] , Posté le: 06-12-2004 15:15 |
|
|
| salemioche a écrit: |
Oui mais si tu es obligé de mettre une couche de div intermédiaire |
Non, l'élément en lui-même suffit.
- Version en position absolue :
http://www.alsacreations.com/articles/centrer/csscentrer.htm (l'élément centré est le div "global")
- La version en position relative est la version classique (dans le flux) :
| Code: |
#global {
position: relative; /* on positionne le conteneur */
margin-left: auto;
margin-right: auto;
width: ...;
} |
|
|
|
salemioche
salemioche
|
| Repositionnement [resolu] , Posté le: 06-12-2004 15:17 |
|
|
Donc l'element absolute doit etre dans le #global, tu ajoutes bien une couche entre le body et le div absolute.
.
______________________________________
creation site internet - Hébergement web - Agence Web |
|
|
SIBELIUS
html mioche
|
| Repositionnement [resolu] , Posté le: 06-12-2004 15:19 |
|
|
| salemioche a écrit: |
| Donc l'element absolute doit etre dans le #global, tu ajoutes bien une couche entre le body et le div absolute |
Euh non "global" est l'élément absolu. Il se suffit à lui-même.
| Code: |
HTML :
<div id="global">
</div>
|
| Code: |
CSS :
#global {
position:absolute;
left: 50%;
width: 700px;
height: 400px;
margin-left: -350px; /* moitié de la largeur */
border: 1px solid #333;
background-color: #eee;
}
|
|
|
|
salemioche
salemioche
|
|
SIBELIUS
html mioche
|
| Repositionnement [resolu] , Posté le: 06-12-2004 15:34 |
|
|
| salemioche a écrit: |
(qui ressort de 2003, tu nous deterres les antiquités  ) |
Spa ma faute !!! Faut engueuler Dany !  |
|
|
salemioche
salemioche
|
|
|
|
 S'enregistrer
 Profil
 Se connecter pour vérifier ses messages privés
 Rechercher
 Membres
 FAQ
 Connexion
|
![Répondre au sujet à css:Repositionnement [resolu]](templates/subSilver/images/lang_french/reply.gif)