28220 sujets

CSS et mise en forme, CSS3

[résolu]Décalage de div

Bonjour

J'ai un décalage avec 2 div sous FF (IE ok):

upload/8558-capture3.gif

Je pourrais faire un div qui engloberait les rubriques news et zoom avec une largeur maximum, mais cela ne me semble pas génial...

Le code: 

<div id="une-centre">

<div id="laUne">
<BOUCLE_article_a_la-Une(ARTICLES) {id_mot = 1} {par date} {inverse} {0,1}>
<h1><ahref="#URL_ARTICLE">#TITRE</a></h1>[(#LOGO_ARTICLE|right||image_reduire{200})]
<h2>#CHAPO&nbsp;<a href="#URL_ARTICLE">[L'article]</a></h2>
</BOUCLE_article_a_la-Une>
</div>

<div id="news">
<div id="news-haut">
<div class="boiteTitre">NEWS</div>
</div>
<div id="news-centre">
<p>test</p>
</div>
<div id="news-bas"></div>
</div>
					
<div id="zoom">
<div id="zoom-haut">
<div class="boiteTitre" >ZOOM</div>
</div>
<div id="zoom-centre"><p>test</p>
</div>
<div id="zoom-bas"></div>
</div>

</div>


/* Cadre à la UNE */

#cadre-alaune{
	width: 817px;
	margin: 0;
	padding:0;
}

#une-haut {
	width: 817px;
	background-image: url(/squelettes/images-structure/boites-centre/la-une-haut.gif);
	height: 31px;
}

#une-centre {  
	background: url(/squelettes/images-structure/boites-centre/la-une-centre.gif);
	width: 817px;
	overflow: hidden; 
}

#une-bas {  
	background-image: url(/squelettes/images-structure/boites-centre/la-une-bas.gif);
	background-repeat: no-repeat;
	width: 817px;
	height: 8px;
	overflow: hidden;
	margin: 0;
	padding:0;
}

#laUne{
	clear:both;
	width: 817px;
	margin: 10px 0px 20px 0px;
}
	
#laUne h1 {
	font-family:: Arial, Helvetica, sans-serif;
	margin: 0px;
	padding-left: 8px;
	font-weight: bold;
	font-size: 15px;
	background-image: url(images/news-fond-h1.jpg);
	background-repeat:: repeat-y;
	color: #0000FF;
	line-height: 22px;
}

#laUne h2 {
	font-family:: Arial, Helvetica, sans-serif;
	margin: 0px;
	padding: 8px 5px 20px 8px;
	font-size: 11px;
	color: #000000;
	text-align: justify;
	font-weight: bold;
	line-height: 2;
}

#laUne a {
	text-decoration:none;
}

#laUne .spip_logos {
	border: #a1a1a1 1px solid;
	margin: 0px 100px 0px 60px;
	clear:both;

}


/* NEWS */

#news{
	width: 397px;
	float: left;
	margin: 0px 0px 0px 5px;
	overflow: hidden;

}

#news-haut {
	width: 397px;
	background-image: url(/squelettes/images-structure/boites-centre/zoom-haut.gif);
	height: 30px;
}

#news-centre {
	background: url(/squelettes/images-structure/boites-centre/zoom-centre.gif);
	width: 397px;
}

#news-bas { 
	background-image: url(/squelettes/images-structure/boites-centre/zoom-bas.gif);
	background-repeat: no-repeat;
	width: 397px;
	height: 7px;
}

.boiteTitre {
	padding: 8px 40px 0 40px;
	color: #663300;
	font-size: 12px;
}

#zoom{
	width: 397px;
	float: right;
	margin: 0px 5px 0px 0px;
	overflow: hidden;
}

#zoom-haut {
	width: 397px;
	background-image: url(/squelettes/images-structure/boites-centre/zoom-haut.gif);
	height: 30px;
}

#zoom-centre {
	background: url(/squelettes/images-structure/boites-centre/zoom-centre.gif);
	width: 397px;
}

#zoom-bas {
	background-image: url(/squelettes/images-structure/boites-centre/zoom-bas.gif);
	background-repeat: no-repeat;
	width: 397px;
	height: 7px;
}


Merci pour l'aide!
Modifié par pbpub (06 Oct 2006 - 12:24)
Hello ! 
#zoom{
	width: 397px;
	margin: 0px 5px 0px 8px;
	overflow: hidden;
}

Smiley murf c'est bon ? (j'ai viré le float:right et ajusté le margin-right de 8px)
Modifié par Ralfman68 (05 Oct 2006 - 03:40)
sinon ton site est pas trop mal.
Je pense qu'il serait intéressant de rendre les menu plus dynamique en mettant de la couleur pendant le survol et un peu plus de contrast que tu clique sur le menu. Smiley smile et puis ça sera parfait.
C'est bon!

Merci!

Bon, cela me fait des truc bizarre dans les marges (top sur FF). Je vais essayé de régler le truc!

Merci encore!
Sujet clos
Aller à