Images décalées sur Dream
Maxime
-
arthezius Messages postés 3756 Statut Membre -
arthezius Messages postés 3756 Statut Membre -
Bonjour,
Pour insérer du texte sur une image dans Dreamweaver j'utilise ça :
<div style="position:absolute; top:X; left:Y">Bla bla bla</div>
Je le positionne bien dans Dream et une fois la page web ouverte le texte apparait complètement décalé ! (sur la gauche quand c'est Firefox et sur la droite quand c'est IE) Comment régler ça ?
Pour insérer du texte sur une image dans Dreamweaver j'utilise ça :
<div style="position:absolute; top:X; left:Y">Bla bla bla</div>
Je le positionne bien dans Dream et une fois la page web ouverte le texte apparait complètement décalé ! (sur la gauche quand c'est Firefox et sur la droite quand c'est IE) Comment régler ça ?
A voir également:
- Images décalées sur Dream
- Des images - Guide
- Extraire images pdf - Guide
- Recherche images - Guide
- Superposer des images ✓ - Forum Graphisme
- Images enregistrées - Forum Blender
8 réponses
<div style="position:absolute; top:X; left:Y">Bla bla bla</div>
Avec un code comme celui-ci, ton bloc sera placé par rapport au côté droite de l'écran.
Son positionnement dépendra donc de la taille de l'écran.
L'idéal est de le placer par rapport au centre.
Exemple de code:
HTML
<div id="container"> </div>
CSS
div#container{ width:900px; position:absolute; top:0px; left:50%; margin-left:-450px; }
Ce bloc sera centré, quelques soit l'écran.
L'important est que le margin-left soit la moitié du width (pour un bloc centré dans l'écran).
Une autre solution aurai été un margin:auto;. Toutefois, ceci ne marchait pas avec IE6.
Et bien non parce que je ne l'ai pas encore posté sur mon serveur et vu que celui-ci est petit je ne vais pas pouvoir mettre cette page en plus des autres ...
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Oui voilà le code HTML :
<body>
<div align="center"><img src="accueil.png" alt="Bienvenue" width="749" height="561" border="1" /></div>
<div id="container"> Bla Bla Bla </div>
</body>
</html>
Et le CSS :
<style type="text/css">
<!--
div#container{
width:176px;
position:absolute;
top:139px;
margin-left: 200px;
.style1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 9px;
left: 26px;
}
<body>
<div align="center"><img src="accueil.png" alt="Bienvenue" width="749" height="561" border="1" /></div>
<div id="container"> Bla Bla Bla </div>
</body>
</html>
Et le CSS :
<style type="text/css">
<!--
div#container{
width:176px;
position:absolute;
top:139px;
margin-left: 200px;
.style1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 9px;
left: 26px;
}
