28173 sujets

CSS et mise en forme, CSS3

Espace entre deux bloc dans firefox qui ne devrait etre

Voilà mon problème : ici
Dans firefox j'ai cet espace tandis que dans i.explorer je ne l'est pas
Voilà le code de la page 
<body>
<div class="main">
  
    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="766" height="226">
      <param name="movie" value="img/menu.swf" />
      <param name="quality" value="high" />
      <embed src="img/menu.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="766" height="226"></embed>
    </object>
  
  <div class="conteneur"> 
		
		
		<div class="bloc_pub">
		<p>&nbsp;</p>
		</div>
	
		<div class="bloc_principal">
		</div>
		
		<div class="footer">
		</div>
	

  </div>

</div>
</body>

Et celui de ma css:
/* ---------------- STYLE GENERAL DU SITE ---------------- */

/*   ----- PAGE -------- */
body {
	margin:0px;
	padding:0px;
	font-size: 11px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color:#606060;	
}
.main {
	width:766px;
	border:#DCDCDC 1px solid ;
	background:url(../img/fond.png);
	margin-left: auto;
	margin-right: auto;
	padding-bottom:15px;
}
.conteneur {
	width:541px;
	margin-left: auto;
	margin-right: auto;	
}
.bloc_pub {
	background-image: url(../img/fond_conteneur.png);
	

}
.bloc_principal {
}
.footer {
}
		
/* ---- LIENS ----- */
a:link		{color:#386789;}
a:visited	{color:#386789;}
a:hover 	{text-decoration: underline; /*font-weight:bold;*/}

/*  ------- FORMULAIRES ------ */

/* ------ IMAGES ------ */
img { border:0;}
object {border:0;}


Comment pourrais-je faire pour corriger ce problème?
Modifié par analfabete (17 Apr 2006 - 14:55)
Bonjour Smiley cligne

L'espace est du au fait que ta balise <p> possède une marge et que ta div, n'a pas de padding (top dans ce cas ci). C'est un problème connu. Il suffit de supprimer la marge supérieur de ton élément <p> ou d'appliquer un padding-top à ta div qui contient l'élément <p>.
Maintenant j'ai un nouveau probleme avec IE

http://img105.imageshack.us/img105/921/pasbon6gu.gif

et avec Firefox:
http://img136.imageshack.us/img136/2899/bon8ce.gif

Voilà le code de la page du bloc conteneur:
<div class="conteneur"> 
		
		<div class="bloc_pub">
		  <img class="pub" src="img/banniere_pub.png" width="468" height="60" />
		  <img src="img/bordure_cadre_bas.png" width="541" height="7" />
		</div>
	
		<div class="bloc_principal">
			<img src="file:///D|/Argent Facile/Dev/src_img/bordure_cadre_haut.png" width="541" height="3" />
			<br/>
			<br/>
			hsfghfg
		</div>
		
		<div class="footer">
		bonjour	<br/>
		</div>
  
  </div>


Et de la css:
/* ---------------- STYLE GENERAL DU SITE ---------------- */

/*   ----- PAGE -------- */
body {
	margin:0px;
	padding:0px;
	font-size: 11px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color:#606060;	
	}
.main {
	width:766px;
	border:#DCDCDC 1px solid ;
	background:url(../img/fond.png);
	margin-left: auto;
	margin-right: auto;
	padding-bottom:15px;
	}
.conteneur {
	width:541px;
	margin-left: auto;
	margin-right: auto;	
	}
.bloc_pub {
	padding-top:2px;
	background-image: url(../img/fond_conteneur.png);
	}

.bloc_principal {
	background-image: url(../img/fond_conteneur.png);
	margin-top:2px;
	}
.footer {
	}
		
/* ---- LIENS ----- */
a:link		{color:#386789;}
a:visited	{color:#386789;}
a:hover 	{text-decoration: underline; /*font-weight:bold;*/}

/*  ------- FORMULAIRES ------ */

/* ------ IMAGES ------ */
img.pub {   
	display: block;
   	margin-left: auto;
   	margin-right: auto 
	}

img { border:0;}
object {border:0;}
Salut,

Non, moi je ne pense pas Smiley cligne

Je pense que si tu mettais simplement les marges du premier élément à 0, le problème passerait Smiley cligne
Modifié par Antoine Cailliau (15 Apr 2006 - 21:08)
Smiley deleted
................................................................................................
Modifié par gg67 (17 May 2006 - 22:33)
Sujet clos
Aller à