Hello,
Je comprends pas ... J'essaie d'appliquer des scrollbar colorées pour IE (bref le truc le plus simple des css ), et ça m'applique rien du tout ...
Spéc ...
Voici ma feuille de style :
Qu'est-ce qui bloque ??
/***** menu CSS *****/
#holder {
position: absolute;
top: 0;
left: 0;
}
#header {
height: 115px;
border: none;
background: url(images/fond-header.gif) repeat-x 0 0;
}
html, body, #holder {
min-height: 100%;
height: 100%;
}
html>body #holder {
height: auto;
}
body {
margin: 0;
padding:0;
scrollbar-3dlight-color: #FFFFFF; scrollbar-arrow-color: #FF9900; scrollbar-darkshadow-color: #990000; scrollbar-face-color: #990000; scrollbar-highlight-color: #CCCCCC; scrollbar-shadow-color: #CCCCCC; scrollbar-track-color: #CCCCCC;
}
#content {
position: relative;
margin-left: 160px;
margin-top: 34px;
margin-bottom: 10px;
background-color:#FFF
}
.haut { /* bloc haut : hauteur définie et image de fond */
height: 46px;
background-image: url(images/cadre/haut.gif);
}
.hautd { /* bloc haut droit: tailles, image de fond et alignement */
height: 46px;
width: 80px;
background-image: url(images/cadre/hautd.gif);
float: right;
}
.bas { /* bloc bas : hauteur définie et image de fond */
height: 68px;
background-image: url(images/cadre/bas.gif);
font-size: 0;
}
.basd { /* bloc bas droit: tailles, image de fond et alignement */
height: 68px;
width: 80px;
background-image: url(images/cadre/basd.gif);
float: right;
font-size: 0;
}
.centre { /* bloc centre : bord gauche qui ne se répète qu'en hauteur */
background-image: url(images/cadre/gauche.gif);
background-repeat: repeat-y;
}
.contenu { /* bloc contenu : bord droit qui ne se répète qu'en hauteur */
font-size: 0.9em;
text-align:justify;
background-image: url(images/cadre/droite.gif);
background-repeat: repeat-y;
background-position: right;
padding: 5px 55px 1px 30px; /* marges internes pour que le texte ne colle pas aux bords */
}
#footer {
clear: both; height: 1.3em; position: absolute; bottom:0px; background:#006699; text-align:right; color: #F2E7DB; border: none; width: 100%;}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
z-index: 100;
list-style-type: none;
font-family: verdana, arial, sans-serif;
font-weight: normal;
}
#menuglobal {
position: absolute;
left: 35px;
top: 155px;
}
.menu {
width: 136px;
height: 26px;
text-align: left;
font-size: 14px;
padding:3px 1px;
font-weight: bold;
}
.menu a, .menu a:visited {
display: block;
line-height: 26px;
height: 100%;
width: 136px;
color: #006699;
text-indent: 0.4em;
text-decoration: none;
background: url(images/bouton.gif) no-repeat 0 0;
}
.menu a:hover {
background: url(images/bouton.gif) no-repeat 0 -26px;
color: #006699;
}
#smenu1, #smenu2, #smenu3, #smenu4 {
position: absolute;
z-index: 100;
left: 110px;
margin-top: -21px;
display: none;
background-color: #859FBB;
font-size: 12px;
font-weight: bold;
width: 150px;
text-align: center;
/* following is not valid CSS */
filter:alpha(opacity=75);
-moz-opacity:0.75;
opacity: 0.75;
}
#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a {
color: #000;
font-weight: bold;
}
#smenu1 a:hover, #smenu2 a:hover, #smenu3 a:hover, #smenu4 a:hover {
color: #FECB33;
}
a {
color: #FECB33;
text-decoration: none;
}
a:hover {
color: #F2E7DB;
}
ul, li {
margin: 0;
padding: 0;
font-weight: bold;
list-style-type: none;
}
/* les 3 boutons du header*/
.bt1 {
position: absolute;
top: 18px;
left: 480px;
}
.bt2 {
position: absolute;
top: 38px;
left: 450px;
}
.bt3 {
position: absolute;
top: 58px;
left: 425px;
}
body, html {
margin: 0;
padding: 0;
background: #F2E7DB;
font-family: verdana, sans-serif;
font-size: 0.9em;
}
#plan {
position: absolute;
right: 0px;
top: 0px;
color: #F2E7DB;
}
#plan a {
margin: 0;
padding: 0;
color: #F2E7DB;
text-decoration: none;
}
#plan a:hover {
color: #FECB33;
}
/*cadre arrondi */
#background {
position: absolute;
left: 25px;
top: 149px;
height: 339px;
width: 138px;
background: url(images/cadretitre/cadre.gif) no-repeat;
}
.identification{
font-weight: bold;
font-size: 1.0em;
margin-top: 200px;
color: #006699;
}
/*formulaire*/
form {
width: 75%;
margin-left: auto;
margin-right: auto;
text-align: left; /* on rétablit l'alignement normal du texte */
font-family: Verdana, Arial, sans-serif;
font-size: 1.1em;
}
form fieldset{
border: 1px dashed #79C;
padding: 10px;
background-color: #FFF;
}
form legend{
background-color: white;
padding: 1px 4px;
color: #B6C5D6;
font-weight:bold;
}
form div{
padding: 6px 8px;
}
form div.bloc label {
display: block;
float: left;
width: 30%;
}
form div.center {
text-align: center;
}
p.message{
text-align: center;
}
label {
font-family: Verdana, Arial, sans-serif;
font-weight:bold
}
input {
background-color: #DEE6EE;
color:#000;
font-size:12px;
}
select, option {
background-color: #DEE6EE;
}
textarea {
border:1px solid black;
font-size: 1.1em;
}
input.bouton {
border:2px outset #DEE6EE;
font-weight:bold;
cursor:pointer;
}
input.bouton:hover {
background-color:white;
color: #000;
}
/*fin du formulaire */
/* différentes mises en forme de texte*/
.gras {
font-weight : bold;
}
.gch {
display: block;
float: left;
}
.center {
text-align:center;
}
.dte {
display: block;
float: right;
text-align: right;
}
.liens {
color: #006699;
font-weight : bold;
background: none;
}
.liens:hover {
color: #FECB33;
background: none;
}
/* titres */
h1, h2, h3 {
padding-left: 2em;
}
h2 {
margin-left: 1em;
background: url(images/puce.gif) 0px 50% no-repeat;
}
h3 {
margin-left: 2em;
background: url(images/puce2.gif) 0px 50% no-repeat;
}
p {
text-indent: 1em;
}
Merci beaucoup
---------------
ressources pédagogiques et préparations de cours pour l'enseignement - Actualité de l'enseignement - [url=http://www.enseignons.be/forum/index.php]