FLOAT problème sous Firefox

toy76 · 18 Juillet 2005

Bonjour,

Décidément, je ne suis pas le roi du CSS car ca fonctionne toujours sous IE mais jamais sous firefox...

Je souhaite afficher l'image à droite avec le texte à coté et pas en dessous, sans m'embeter avec un tableau...
Je pense au Float... je le met dans mon css, puis dans un div... mais rien y fait ! à gauche ca fonctionne à droite ca ne fonctionne pas...

le code CSS :
.imggauche {float: left; margin: 5px 5px 5px 0;display:};
.imgdroite {float: right; margin: 5px 0 5px 5px;};

le code HTML:
<div class="imgdroite">
<img src="./articles/recif1.jpg" width="276" height="185" alt="Récif corallien 1m de fond aux Maldives" border="0"><br>
</div>

Alors qu'est je fais comme bétise encore ??

MERCI à tous

le problème est visible là :
http://www.photodumonde.com/article_eln ... nino_intro

Jderamaix · 18 Juillet 2005

Essaye plutôt

<img src="./articles/recif1.jpg" width="276" height="185" alt="Récif corallien 1m de fond aux Maldives" border="0" class="imgdroite">

Ensuite, il vaut mieux éviter les chiffres sans unité, même avec 0.

Voila déjà 2 pistes.

++

toy76 · 18 Juillet 2005

J'avais déjà essayé aussi... pour etre sur j'ai recommencé, mais pas mieux...

thomaspirit · 18 Juillet 2005

Applique plutôt tes styles à l'élément html IMG directement et utilise des padding, ça devrait marcher.
De plus "display:", s'agit'il d'une faute de frappe ? Si ce n'est pas le cas, cours mettre un attribut à ce pauvre display. Un "float: (left|right)" force automatiquement un "display: block;" de toute façon..., tu peux donc l'enlever.

toy76 · 18 Juillet 2005

le display était bien un reste de copier/coller

appliquer à IMG, c'est à dire ?

thomaspirit · 18 Juillet 2005

.imggauche img {float: left; margin: 5px 5px 5px 0;display:};
.imgdroite img {float: right; margin: 5px 0 5px 5px;};

mieux :

img.gauche {...}
img.droite {...}

<img class="gauche" ... />
<img class="droite" ... />

thomaspirit · 18 Juillet 2005

Et avec des padding... 8)

Jderamaix · 18 Juillet 2005

J'ai eu du mal

Il y a plein d'erreurs :

1°) Les balises <style> ne sont pas dans le head. Tu les as placées avant le <html>
Place le tout entre les balises <head></head>
2°) <style ="text/css"> ne veut rien dire. C'es <style type="text/css">
3°) Il y a des ; après les deux lignes de class d'image. Supprime les.
4°) L'image doit être DANS le div qui l'entoure, si possible en première position, mais c'est pas trop grave.

Avec ces 4 modifs, ca marche.

5°) utilise des balises <p> pour séparer tes paragraphes. <div> est une case et <p> un paragraphe de texte. Ca ne change pas grand chose, mais ça va t'aider quand ça deviendra complexe.

++

toy76 · 18 Juillet 2005

Merci, c'est vrai que maintenant que tu m'en parle, c'est le bordel... en fait j'ai mis mes include au mauvais endroits... Mais le vrai truc qui fait chier Firefox, c'était les ; quand j'ai lu ton post, je me suis dit "mais qu'est ce que je peux etre ....parfois

MERCI BEAUCOUP, je vais allez faire du rangement...