28173 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai un site constitué simplement dans ça partie médiane de 3 colonnes :
- un panneau gauche en absolute (largeur 200px)
- un panneau droite en absolute également (largeur 200px)
- un corps dans le flux avec, pour éviter le piétinement un margin-left et un margin-right de 200px.

Le problème c'est que IE dans sa version 6 n'interprète pas ce margin-right.
Et je ne peux pas placer mes 2 panneaux en float pour d'autre raison.

Quelqu'un aurait-il une idée à me suggérer ?
Merci
Salut,

c'est curieux,IE6 comprend très bien les marges, normalement. Aurais-tu un exemple en ligne, qu'on puisse jetter un coup d'oeil sur le code ?
Oui bien entendu, voilà une page où le problème est particulièrement visible :
http://pma32.com/fr/catalogue.php5?id_categorie=3

Je précise que le HTML est généré dynamiquement ce qui rend son source assez pénible à lire et que ce site a été fait sous la pression d'un délai relativement serré ce qui explique un css quelque peu fouillis ... j'en suis désolé.

Sinon, je suspecte quelque peu le contenu du corps en lui-même.

Donc mon panneau gauche a l'ID #gauche le droite #droite, le corps a l'ID #corps et les vignettes suspectées sont des liens en display=block et float=left "soutenus" par par un hr en visibility: none et clear:both.
Dans la page pointée, ces vignettes appartiennent à la class .article2

voilà et encore merci.
Si tu regardes le rendu dans IE6, il semblerait que le bloc central soit à peu près correctement dimensionné (la marge étant interprétée... vérifier avec un background: red; sur le bloc central, pour voir...), mais que certains éléments enfants ou descendants du bloc central dépassent allègrement à droite.

On cherchera donc plutôt de ce côté-là.
Et ça n'a peut-être rien à voir, mais des éléments de type bloc imbriqués dans un élément de type en-ligne, c'est pas terrible...
<a class="article2" title="Relevage arrière 02" alt="Relevage arrière 02" href="...">
<h2>Relevage arrière 02</h2>
<img title="" alt="" src="photos/thumbs/453e9e4363b11eaba25a29302ba51114c66c53cd.jpg"/>
<p>20 € En stock</p>
</a>
Merci Florent V, c'est effectivement ce que je pensais en suspectant le contenu du bloc central plutôt que le bloc en lui même.

Par contre quand tu parles d'éléments de type bloc dans un de type en-ligne, si tu fais allusion aux <img> et autre <p> dans la balise <a>, sache que j'ai passé ces <a> en type bloc.

Il est vrai également que la div centrale respecte bien ce margin (et que je n'ai même pas eu la présence d'esprit de vérifier), merci d'avoir mis le doigt là dessus.

Donc en fait, les éléments flottants de class .article2, sorte de la div centrale ... ce qui est assez gênant en fait ... il faut donc que je me concentre sur comment faire qu'ils restent bien dans cette div, sachant que le float est pour ainsi dire obligatoire dans ce contexte.
Bon ben on va expérimenter.

Merci de vos lumières et de votre réactivité
RaGe a écrit :
Par contre quand tu parles d'éléments de type bloc dans un de type en-ligne, si tu fais allusion aux <img> et autre <p> dans la balise <a>, sache que j'ai passé ces <a> en type bloc.

Ça (le display: block), c'est la tambouille CSS pour l'affichage à l'écran. Je te parle en fait plutôt de ta stucture HTML.

Selon la spécification HTML, l'élément a ne peut contenir que des éléments de type en-ligne (exemple : em, span, img... mais pas div, p, hN, blockquote, pre...). L'intitulé d'un lien n'est pas censé être un bloc englobant un contenu varié, mais un flux de texte de préférence court.

Comment fera une synthèse vocale pour rendre la structure de tes liens-blocs ? Ça risque d'être problématique...

Ton lien qui englobe tout un ensemble d'éléments sert uniquement à faire que l'on puisse cliquer sur toute une zone. Il y a d'autres moyens de faire cela, en CSS ou en Javascript. Je ne les ai pas trop en tête là tout de suite, mais ça doit être jouable... pour peu qu'un lien sur toute une zone de contenu soit pertinent. Smiley cligne
oui effectivement j'use et abuse de la technique du hover des <a> en bloc ...
du coup je déborde un peu de la logique CSS.
Je vais quérir une manière plus raisonnable.

Par contre je reste persuader que mon problème vient des éléments en float qui "sortent" de leur conteneur (une intuition).