Salut à tous !
J'ai un petit problème, tout c**, mais un problème quand meme XD

J'utilise parfois Front Page (ou DreamWeaver) et j'ai utilisé sur un de mes sites leur fonction "Calque". Ce qui génère une <div> déplaçable et très utile. Donc, je place la div/calque à la position désiré. Tout est OK.

Je teste ma page sur un navigateur, là aussi, tout est OK. Pour voir si ma page aura le meme visuel dans différentes résolutions, je fais Ctrl+- (toujours dans le navigateur). Et la je vois que la div est en train de bouger, de flottez. Comment faire pour qu'il suivent le design pendant le Ctrl+- ?
Ou comment centré la div ?

Voici à quoi ressemble le code généré par DreamWeaver :

<style type="text/css">
<!--
#Layer1 {
    position:absolute;
    left:65px;
    top:64px;
    width:243px;
    height:122px;
    z-index:1;
}
-->
</style>
</head>
<body>
<div id="Layer1"></div>
</body>
</html>

Merci d'avance ^^

11 réponses


Jo'
Réponse acceptée

Si tu veux centrer un élément, il faut que tu lui donnes une taille et lui mettre un margin auto

width: XXpx;
margin: 0 auto;

Salut,

Change la valeur de ton position: absolute par, position: fixed

noham-el
Auteur

Salut,
Merci Jo', ça marche ^^ Mais comment faire pour centré la div ?

En tous cas merci ^^

Tu veux center la div par rapport à quel élément ?

noham-el
Auteur

A un tableau, qui est centré.

Et si tu essayais avec un

margin: 0 auto;
noham-el
Auteur

Heu... oui. Sauf que ça centre sans prendre connaissance de la résolution (en gros, ça sort du champ).
J'explique en images :

Voici la première image, qui est un print du résultat que je voudrait. La Div qui contient le "Facebook", je voudrait qu'il soit à cette position (ce qui est le cas dans ma résolution 1152x864) :
http://nsa25.casimages.com/img/2011/02/16/110216120220312269.png

Mais dès que je dézoome un peu sur un navigateur pour voir +- ce que sa donneras sur une autre résolution, ça donne sa :
http://digimania.olympe-network.com/image2.png

On voit qu'en faites via le "fixed" qu'il ne flotte pas n'importe ou, mais reste fixe. Mais comme mon design est centré et que la div croit que le design est à gauche, ben c'est un peu décalé...

En tous cas, merci ;)

noham-el
Auteur

:'(

Le Dézoom a un effet particulier et ne représente pas forcément ce que vont voir les gens avec leur navigateur. Normalement le bouton va bouger et devrai rester en position.

noham-el
Auteur

Merci Grafikart de m'avoir répondu, oui sa reste en position, mais je veux qu'il reste sur le coté droit juste au dessus de mon tableau blanc/noir comme ceci (http://nsa25.casimages.com/img/2011/02/16/110216120220312269.png) car j'ai testé dans différents taille d'écran et ça ne reste pas à la position droite désiré. Comment faire du coup ?

Salut !
Moi aussi je serais bien intéressé de centré une div...