FLOAT problème sous Firefox

[toy76]

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]

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]

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

 

[thomaspirit]

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]

le display était bien un reste de copier/coller

appliquer à IMG, c'est à dire ?

 

[thomaspirit]

.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]

Et avec des padding... 8)

 

[Jderamaix]

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]

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...