view css/Somatic.css @ 74:d9490757a111

Aide pour IE: Classes explicites et pas de syntaxe XHTML. Le selecteur [id^='Gest'], bien que pratique, n'est pas supporter par IE6. En conséquence, j'ai ajouté une classe Gestion sur l'ensemble des div concernés et j'ai remplacé cela par un très classique div.Gestion. D'autre part, visiblement, le <label /> faisait plus que troubler IE, qui ne comprenait par conséquent pas bien ou ce dernier ce finissait. Le problème a été réglé en décompactant la balise.
author Franck Deroche <webmaster@defr.org>
date Mon, 31 Mar 2008 14:53:49 +0200
parents 390bbf7c5aea
children
line wrap: on
line source
/* Dual Blog, Somatic Edition */

html {
	margin:0;
	padding:0;
	background:#EEE; 
	font-family:"Bitstream Vera Sans", "Lucida Grande", Tahoma, Verdana, Arial, sans serif;
	font-size:small;
}

#Link, #Link li, dl, dt, dd {display:block; margin:0;list-style-type:none;}

#Main {
	width:798px;
	margin:5px auto 0;
	padding:0;
	background:white;
	border:1px #333 solid;
	border-bottom:0;
}

h1 {
	margin:0 0 150px;
	padding:5px;
	height:21px;
	text-align:center;
	border-bottom:1px #333 solid;
	font-size:17px;
	background-image:url('Res_Somatic/bg_test.png');
	position:relative;
	z-index:3;
}

#Adresse, #SideBar dt {
	position:absolute;
	top:38px;
	left:50%;
	display:block;
	width:132px;
	padding-top:135px;
	background-repeat:no-repeat;
	background-position:2px 5px;
	background-color:#FFF;
	text-align:center;
	border-bottom:1px #333 solid;
	border-right:1px #333 solid;
	font-size:0.9em;
	z-index:2;
	cursor:pointer;
}

/* Let's give some 8-bits pngs to IE... */
* html #Adresse {background-image:url('icons/fav_8bit.png') !important;}
* html #About {background-image:url('icons/connect_8bit.png') !important;}
* html #Profile {background-image:url('icons/profile_8bit.png') !important;}
* html #Like {background-image:url('icons/like_8bit.png') !important;}
* html #Geekness {background-image:url('icons/geek_8bit.png') !important;}
* html #Archives {background-image:url('icons/Hank_8bit.png') !important;}
* html #ToDo {background-image:url('icons/todo_8bit.png') !important;}

#Adresse {
	margin-left:-398px;
	background-image:url('icons/fav.png');
}

#About {
	margin-left:-265px;
	background-image:url('icons/connect.png');
}

#Profile {
	margin-left:-132px;
	background-image:url('icons/profile.png');
}

#Like {
	margin-left:1px;
	background-image:url('icons/like.png');
}

#Geekness {
	margin-left:134px;
	background-image:url('icons/geek.png');
}

#Archives {
	margin-left:134px;
	background-image:url('icons/Hank.png');
}

#ToDo {
	margin-left:267px;
	border-right:0 !important;
	background-image:url('icons/todo.png');
}

#SideBar dt:hover, #Adresse:hover {background-color:#dec;}

.Actif {background-color:#eee !important;}

#SideBar p, #Posts {margin:5px 0; padding:0;text-align:justify;}

#Link, #SideBar dd  {
	font-size:0.9em;
	border-bottom:1px #333 solid;
	padding:5px 10px;
	background:url('Res_Somatic/bg_test.png') #fff;
	height:150px;
	overflow:auto;
	position:absolute;
	top:187px;
	width:778px;
	z-index:0;
}

#Link {display:none;}

.PostContent {
	padding:10px;
	text-align:justify;
	border-bottom: 1px #333 solid;
}

.PostContent h2 {
	font-weight:bold;
	text-align:center;
	border:1px #666 solid;
	margin:0 15px;
	background:url('Res_Somatic/bg_titre.png');
	font-size:1.2em;
}

.PostContent h2 abbr {
	padding:2px 0;
}

#SideBar a, #Link a {text-decoration:none;color:#666;font-style:italic;margin-bottom:1px;border-bottom:1px dashed;}
#SideBar li, #Link li {line-height:1.5em;}
#Link a {margin-left:10px;}
#SideBar a:hover, #Link a:hover, #Posts a:hover {border-bottom:1px solid;}
#SideBar ul, .PostContent ul {list-style:url(Res_Somatic/puce.gif) outside;}

a:not([href]) {border-bottom:0 !important;}

a img {
	padding:10px;
	margin:0 10px 10px;
	border:1px solid #795;
	background-image:url('Res_Somatic/bg_test.png');
}

code, blockquote {
	border:1px #795 solid;
	border-left-width:3px;
	background:url('Res_Somatic/bg_test.png') #FFE;
	padding:2px 6px;
}

p.code code {
	white-space:pre;
	overflow:auto;
	display:block;
}

code {line-height:1.5em;}

em, i, .i {color:#67B;}
#Posts a {color:#795;text-decoration:none;}
#Posts {padding-top:170px;}

.mood, .gravatar, .gallerie {
	float:left;
	margin:1.5em 1em 0.5em 0;
	padding:10px;
	border:1px #795 solid;
	background:url(Res_Somatic/bg_test.png);
}

.gravatar {
	margin:0 1em 0 0 ;
}

.gallerie {
	padding:1.5em;
	width:300px;
}

.Tongue {
	background:url(/blog/mood/light/Tongue.png) bottom right no-repeat;
}

.Neutral {
	background:url(/blog/mood/light/Neutral.png) bottom right no-repeat;
}

.Goggle {
	background:url(/blog/mood/light/Goggle.png) bottom right no-repeat;
}

.Clop {
	background:url(/blog/mood/light/Clop.png) bottom right no-repeat;
}

.Cry {
	background:url(/blog/mood/light/Cry.png) bottom right no-repeat;
}

.Oohh {
	background:url(/blog/mood/light/Oohh.png) bottom right no-repeat;
}

.Love {
	background:url(/blog/mood/light/Love.png) bottom right no-repeat;
}

.PostContent dd, .PostContent dt {
	border:2px #795 solid;
	padding-left:0.5em;
}

.PostContent dt {
	border-width:2px 2px 0;
	background:url(Res_Somatic/bg_test.png);
	padding:0.3em 1em;
}

.PostContent dd {
	border-top:1px dashed #795;
	margin-bottom:1em;
	padding:0 1em;
}

.PostContent dd ul {
	padding:0;
	list-style-position:inside;
}