28220 sujets

CSS et mise en forme, CSS3

Bonjour tout le monde.

Alors voila mon probleme, je veux mettre un bloc, et sous FF ca marche nikel, alors que sous IE ca me met un decalage d'1px en haut.

Voila mon code:

<div style="background-color:#CEE6D3; height:16px; width:21px; float:left; border:0; padding:0; display:inline;"></div>
Un petit peu plus de code, ou mieux, une url ?

Parce que là, ton décalage d'un pixel, on ne risque pas de le voir Smiley cligne

(ou alors, ma vue s'est encore dégradée, ce qui est possible)
Voila pour le lien:
http://nicccco.free.fr

Et le code je l'ai mis dans le premier message:
<div style="background-color:#CEE6D3; height:16px; width:21px; float:left; border:0; padding:0; display:inline;"></div>

Voila. J'espere que ca suffit!
Modifié par Monico (11 Jul 2005 - 22:15)
haaaa, je l'ai eu celui la !!

ce que j'en au compris, c'est que ie considère qu'il y a qqchose a afficher dans ton <div></div>

donc, t'as beau lui donner une taille, il affichera toujours le div avec une taille minimum correspondant à la taille de la font par défaut.

Smiley biggol

il y a 2 solutions :
- overflow: hidden;
- font-size: 1px;

petit fichier html de démo


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
		<meta http-equiv="Content-Language" content="fr" /> 
		<title></title>
		<style type="text/css">
			
		</style>	
	</head>
	<body>
		<div style="background:#F00;height:4px;"></div>

		<hr />
		<div style="background:#F00;height:4px;overflow:hidden;"></div>
		<hr />
		<div style="background:#F00;height:4px;font-size:1px;"></div>
	</body>
</html>
Ah génial ca marche. Par contre on va coninuer les problemes sur IE, et sur la meme page. Mon menu ne s'aligne pas avec le cadre vert (qui marche maintenant Smiley biggrin ) mais il me le met en dessous.

Meme url pour le voir : http://nicccco.free.fr

Mon code css:

.haras {
display: block;
color:#578BCC;
background-color:#CEE6D3;
border:1px solid #FF7200;
height:31px;
width:177px;
text-decoration:none;
margin-left:21px;
text-align:center;
}

Le code de la page, ca suit en fait le code précédent:

<div style="background-image:url(Images/top_menu.gif); height:14px; width:200px; overflow:hidden;"></div>

<div style="background-color:#CEE6D3; height:16px; width:21px; float:left; border:0; padding:0; font-size:1px;"></div> <!-- petit carre vert a gauche du menu -->

<a href="haras.php" class="haras"><div style="padding-top:6px;">Le Haras</div></a>