Page 1 sur 1

Internet Explorer et Firefox

Posté : 14 avr. 2005, 12:01
par seayoung
Bonjour,
je suppose que c'est un sujet déja abordé mais je ne l'ai pas vue alors je le lance, ou relance.
Voila comme tout le monde a pu le voir il y a de grosse différence d'interprétation entre entre les deux navigateurs.
voici mon problème:
je souhaite mettre une image qui soit tout en haut de ma page à droite et sans marge.
Sur IE pas de problème il me le fait à la perfection mais élas sur FF j ai une marge, mon image est décalée vers le bas ce qui me fausse toute ma mise en page.
En espérant avoir été clair :oops: ,si avez vous une idée
pour info voici le code CSS de mon body

Code : Tout sélectionner

body { margin-left:0px; margin-top:0px; width:600px; }
merci d'avance

Posté : 14 avr. 2005, 12:07
par flitox
Tu peux me passer tout le code pour tester? (simplifie le si possible)

Posté : 14 avr. 2005, 12:53
par Cyrano
Salut,
il y a peut-être un petit ajout à faire pour la balise image:

Code : Tout sélectionner

img { margin: 0px }
Un autre point, "margin" définit des marges extérieures d'un élément: pour les marges intérieures, il faut utiliser "padding", donc essaye de remplacer par :

Code : Tout sélectionner

body { padding-right:0px; padding-top:0px; width:600px; }
L'autre solution, ce serait de mettre l'image en position absolue

Posté : 14 avr. 2005, 13:15
par piet
Je suppose que tu veux mettre du texte en dessous, je me trompe? tu peux toujours définir une balise spéciale pour l'image pour ne pas que tout ton texte s'aligne à droite aussi sans mettre de balise.

genre, tu le mets dans le span comme ceci :

[code]
h1 span {
display: none;
float: right;
}
h1 {
margin: 0;
padding: 0;
height: xxpx;
background-image: url(../img/image.GIF); //url de l'image
}
[/code]

et ton image dans le html, tu la définis comme ceci
<h1><span><a href="./">lien qui ne sert à rien mais affiché si pas de css et pointant vers la page courante en index</a> Texte de remplacement s'il n'y a pas de css</span></h1>

Posté : 14 avr. 2005, 13:42
par Invité
possible je sais pas ce que ca va donner :
[code]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<style type="text/css">
body {
margin-left:0px;
margin-top:0px;
width:600px;
}
p.questions{ margin-left:190px;text-align:justify; background-color:#8FCC14; color:#FFFFFF}
p img{float:left;clear:left;margin:0px}

</style>
</head>

<body >

<p><img src="une image" alt="image" /></p>

<p class="questions">mon texte</p>
</body>
</html>

[/code]
en gros ca donne ca
merci encore

Posté : 14 avr. 2005, 13:45
par seayoung
possible je sais pas ce que ca va donner :

Code : Tout sélectionner

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <style type="text/css"> body { margin-left:0px; margin-top:0px; width:600px; } p.questions{ margin-left:190px;text-align:justify; background-color:#8FCC14; color:#FFFFFF} p img{float:left;clear:left;margin:0px} </style> </head> <body > <p><img src="une image" alt="image" /></p> <p class="questions">mon texte</p> </body> </html>
en gros ca donne ca
merci encore
ca fait quelque chose comme
mon image ---- mon texte
et le tout en haut de ma page .
Merci encore pour tout vos conseils aue je vais essayer

Posté : 14 avr. 2005, 13:50
par seayoung
les tests effectués avec:
padding-top=0px
marging-top=0px
et mettre l'image en absolute n'ont rien donné :?
je ne comprend vraiment pas la :s

Posté : 14 avr. 2005, 14:16
par piet
et si tu essaies en mettant :

padding=0px 0px 0px 0px;
margin=0px 0px 0px 0px;

Posté : 14 avr. 2005, 14:26
par seayoung
Je viens d 'essayer pareil vraiment je comprend pas se probleme
merci PIET pour toutes tes suggestions

Posté : 04 mai 2005, 15:19
par Invité
salut

essai avec ca :

Code : Tout sélectionner

* {padding: 0; margin: 0;} body { padding-right:0px; padding-top:0px; width:600px; }

Posté : 04 mai 2005, 15:55
par seayoung
je n'ai peu etre pas mis a jours ce problème mais je l'ai résolu :
il faut effectivement mettre :
padding: 0px 0px 0px 0px ;
marging:0px 0px 0px 0px ;

toutefois avec une petite précision:
pour tout ce qui est marge ou autre je met tout en em car il parrait que cette norme s'adapte selon les résolution de l'ecran