28173 sujets

CSS et mise en forme, CSS3

Bonne année à tous & toutes !

Totalement novice en CSS j'ai à peu près réussi à faire ce que je souhaitais (sur ce site : http://christian.dache.free.fr ) en travaillant sous Firefox et linux. En testant le résultat au travail sous IE, je m'aperçois qu'une page ne passe pas du tout : http://christian.dache.free.fr/prix.html . Sous IE la marge gauche est beaucoup trop importante et la colonne de droite (id ="photos") qui théoriquement a suffisamment de place va se nicher sous le texte et non à sa droite.

Voici les extraits pertinents du CSS :

BODY {	BACKGROUND: black; MARGIN: 0px; COLOR: white; FONT-FAMILY: "URW Bookman L", Georgia; TEXT-ALIGN: left;}
#texte {FLOAT: left; MARGIN-LEFT: 10%; WIDTH: 70%;}
#photos {FLOAT: right; WIDTH: 180px;}

et itou pour l'HTML :

<body>
<br><a class="accueil" href="index.html">page d'accueil</a>
<br><br>
<div id="texte">
...
</div>
<div id="photos">
...
</div>
</body>
</html>

Merci de votre aide !

Kristen
(accessoirement HR {MARGIN: 1px;} semble aussi inopérant sous IE...)
Modifié par kristen (07 Jan 2008 - 10:42)
Bonjour & bienvenue, kristen.

Pourrais-tu éditer ton message et ajouter les balises adéquates ([ code] & [ /code] sans les espaces) autour de ton code, comme demandé dans les règles du forum ?

Sous quelle version d'IE rencontres-tu ce problème ? Je ne sais pas si ça a été corrigé sous IE7, mais IE6 souffre d'un bug qui lui fait doubler la marge de certains éléments flottants. Pour corriger cela, il suffit d'appliquer
display: inline;
à l'élément qui pose problème via les commentaires conditionnels ...
Super, merci Thomas !

Je n'ai pas eu besoin des tests conditionnels car la modif dans le CSS n'affecte pas le rendu dans les autres navigateurs.

A +
Kristen