28172 sujets

CSS et mise en forme, CSS3

Bonjour,

http://www.cahue.net/wdvpts/html_tests/myTheme_1/indexBlog2Col.html

Mon problème se situe au niveau du conteneur sidebar qui contient deux blocs de couleur bleue:
- catégories
- archives

La couleur orange (celle du conteneur sidebar) prend sur le °bloc archives ( qui devrait etre bleu) et n'englobe pas le 2° bloc archives.
Et sont séparés par du jaune couleur du conteneur content de même niveau.

Normalement il devrait y avoir un espace (mais à vérifier avec les margin et padding) rose, couleur du conteneur englobant le content et la sidebar.



/* ------------------------------------*/
/* RESET                               */
/* ------------------------------------*/

/** --- RESET MINIMUM --- */

tml {
	font-size: 100%; 
}

html, body, blockquote, ul, ol, form {
	margin: 0;
	padding: 0;
}

/* ------------------------------------*/
/* STYLES DE BASE                      */
/* ------------------------------------*/

/** La taille de base des polices correspond à 12px */

body {
	background-color: #e5e5e5;
	color: #444;
	font-family: verdana, helvetica, arial, sans-serif;
	font-size: 75%; /* equiv 12px */
}

html>body {
	font-size: 12px; 
}

p {
	line-height: 1.3333em;
	max-width: 360px;	
}

/** ---  TITRES --- */

h1, h2, h3, h4, h5, h6 {
	font-weight: bold; 
	font-style: normal;
}

h1 {
	font-size: 2em; 
	line-height: 0.6667em; 
	margin-bottom: 0.6667em;
}

h2 {
	
	font-size: 1.5em; 
	line-height: 0.8889em; 
	margin-bottom: 0.4444em;
}

h3 {
	font-size: 1.17em; 
	line-height: 1.1396em; 
}

h4 {
	font-size: 1em; 
	line-height: 1.3333em; 
}

h5 {
	font-size: 0.83em; 
	line-height: 1.6064em; 
}

h6 {
	font-size: 0.67em; 
	line-height: 1.99em; 
}
/* ------------------------------------*/
/* STRUCTURE DE LA PAGE                */
/* ------------------------------------*/

/** --- CONTAINER --- */
/** pour centrer la page et largeur de la page */
#container {
	width: 960px;
	margin-right: auto;
	margin-left: auto;
	padding: 10px;
	background-color: #2121FF; /* bleu foncé */
}
	/**--- HEADER --- */
	#header {
		background: url(../img/header_bg.jpg) no-repeat;
		height: 150px;
	}
	/** MENU HORIZONTAL --- */
	#nav {
		background-color: #FED019; /* orange */
		height: 30px;
	}
	/** FIL D'ARIANNE --- */
	#breadcrumbs {
		background-color: #FFFFCC; /* jaune orange */
		height: 20px;
	}
	/** WRAPPERMAIN --- */
	/** Conteneur pour permettre que le contenu et la sidebar aient la même hauteur */
	#wrapperMain {
		background-color: #FF99FF;  /* rose clair */
		padding: 10px;
	}
		/** CONTENT --- */
		#content {
			background-color: #FFFF33; /* jaune */
			padding: 10px;
		}
			/** News --- */
			#news{
				background-color: #FFCC33; /* orange */
			}
			/** Article --- */
			#article {
				background-color: 	#CC6666; /* rouge orangé */
			}
			/** Aside --- */
			#aside {
				background-color: #33CC00; /* vert foncé */
				border-top: 1px solid #000;
				overflow:auto;
				padding: 10px;
			}
				/** Articles récents --- */
				#articlesRecents {
					background-color: 	#99FF66; /* vert clair */
				}
				/** Commentaires récents --- */
				#commentairesRecents {
					background-color: #99CC00; /* autre vert clair */
				}
		/** SIDEBAR --- */
		#sidebar {
			background-color: #FF8259; /* orange */
		}
			/** Catégories --- */
				#categories {
					background-color: 	#4AC0CA; /* autre bleu */
				}
			/** Archives --- */
				#archives{
					background-color: 	#4AC0CA; /* autre bleu */
				}	
		
	/** FOOTER --- */
		#footer {
			background-color: #FED019; /* orange */
		}
		
/* ------------------------------------*/
/* CLASSES SPECIFIQUES                 */
/* ------------------------------------*/

#header h1 {
		color: #fff;
		text-align: right;
		padding-right: 20px;
		padding-top: 25px;
	}
	
.imgGauche {
	float: left;
	margin-top: 5px;
	margin-right: 10px;
}
.clr {
	clear : both;
}



Cordialement
Modifié par cpalo (29 Dec 2012 - 11:56)
Autant pour moi!!!
la div articles s'ecrit avec un "s"!! qui n'y est pas dans le css!!!

Bonne fin d'année