Bug d'affichage d'un border sous IE à cause d'un hack

[massstreamer]

Bonjour à tous.

IE (encore lui) me fait un broblème d'affichage des BORDER d'une boîte DIV à cause d'un HACK CSS.

Comme vous pourrez le voire à cette adresse (à tester dans IE, les autres navigateurs n'ont pas ce problème):

http://massstreamer.free.fr/col_mm_hauteur.html

J'ai une colonne d'images qui est en FLOAT:LEFT dans la boîte DIV principale. Le texte occupe moins de hauteur de page que les photos. Pour que le bas de la boîte principale arrive en bas des photos, j'ai donc posé le HACK si dessous (un grand classique):

partie CSS:

		.spacer{
			clear:both;
			visibility:hidden;
			font-size:1px;
			margin:0;
			padding:0;
			height:1px;
		}

Partie HTML:

		<div class="spacer"> </div>

Le bas de la boîte DIV arrive bien sous la série de photos seulement voilà, la bordure (BORDER) ne s'affiche pas bien sur toute sa hauteur (comme gommée). Cet effacement bizarre s'accentue quand on joue avec le scroll jusqu'à ce qu'il se stabilise sur une hauteur qui correspond au décalage entre le bas du texte contenu et le HACK (ou le bas de la DIV). Le problème disparaît lorsque j'enlève le HACK mais alors, la présentation laisse à désirer.

Si quelqu'un peu me donner la solution à ce problème ou une alternative, ça m'enlèverais une belle épine hors du pied.

Merci d'avance pour vos réponses.

[Chark]

Juste un truc qui me chiffone déja dans ton CSS :

.col03{

position:absolute;

top:0;

right:0;

float:right;

background-color:#00CC99;

width:150px;

}

Ca serait pas un peu incompatible ?

Modifié 12 Septembre 2006 par Chark

[Chark]

Je pense que tu résoudra ton probleme ( j'ai pas testé ), en changeant :

.col02 p{}

par

.col02 p{ float:left;}

Mais effectivement, le texte ne va pas "s'enrouler" autour des photos

Par contre, pour ton spacer, je ne pense pas que tu ai besoin de mettre tout cela

Moi, j'utilise juste un :

.spacer{
			clear:both;
		}

et un simple :

<div class="spacer"></div>

et cela marche tres bien en général

Modifié 12 Septembre 2006 par Chark

[massstreamer]

Je viens de lire les réponses qui étaient adressées à ma question et je les ai essayée.

Juste un truc qui me chiffone déja dans ton CSS :

.col03{

position:absolute;

top:0;

right:0;

float:right;

background-color:#00CC99;

width:150px;

}

Ca serait pas un peu incompatible ?

Désolé, c'est une erreur de distraction ou de précipitation. Mais sinon, merci de me le faire remarquer Chark.

Je pense que tu résoudra ton probleme ( j'ai pas testé ), en changeant :

CODE

.col02 p{}

par

CODE

.col02 p{ float:left;}

Là par contre, j'ai essayé, et le texte sort de la boîte principale (centrale) par la droite.

Sinon, le HACK CSS marche tout aussi bien avec ta méthode. Merci, je note.

Maintenant, concernant la question principale, posée dans ce topic, j'ai toujours ce P..... de problème d'effacement du BORDER sous IE.