Menu

Modifier la feuille style CSS [Résolu/Fermé]

Messages postés
184
Date d'inscription
samedi 21 janvier 2006
Dernière intervention
18 août 2012
- - Dernière réponse :  djromx - 1 janv. 2009 à 13:29
Bonjour à tous,

Voici ma feuille CSS:

/* style du blog
-------------------------------------------------------- */
body{
margin:0;
padding:0;
font-size:80%;
}
html>body{
background-position:65em 0;
}
p{
margin:1em 0;
line-height:1.5em;
}
form{display:block; margin:0; padding:0;}
code,pre{
font-family:"courier new",monospace;
font-size:1em;
width:100%;
overflow:auto;
}
a[hreflang]:after{
content:"\0000a0(" attr(hreflang) ")";
color:#666;
background:transparent;
}
img,a img{
border:none;
max-width:100%;
text-decoration:none;
}
ul{
list-style:square;
}
.left{float:left; margin-right:1ex;}
.right{float:right; margin-left:1ex;}
h1,h2,h3,h4,h5,h6{
font-weight:normal;
}
h2{
font-size:1.3em;
color:#444;
background:transparent;
}
h3{font-size:1.2em;}
h4{font-size:1.1em;}
fieldset{
border:none;
}
p.field{
clear:left;
margin-left:10px;
}
label.float{
position:relative;
float:left;
width:45%;
}
input,textarea,option{
-moz-border-radius:7px;
padding:2px;
font-size:12px;
}
input.text:focus,textarea:focus{
border-style:inset;
}
textarea{
width:100%;
}
.erreur,.message{
margin-top:5px;
border-left:6px solid #8b120d;
margin:20px;
padding:15px;
width:100%;
}
.message{
border-left:6px solid #006600;
}
.erreur span,.message span{
color:#8b120d;
font-weight:bold;
}
.message span{
color:#006600;
}
.erreur li{
list-style-type:square;
}

/* style de la page
-------------------------------------------------------- */
#page{
width:65em;
margin:0;
padding:0;
background-repeat:repeat-y;
background-position:46em 0;
}

/* style de l'entête (haut)
-------------------------------------------------------- */
#haut{
margin:0;
height:8em;
color:inherit;
margin-bottom:1em;
position:relative;
}
#haut h1{
margin:0;
font-style:italic;
font-weight:bold;
font-size:2.5em;
position:absolute;
bottom:0.5ex;
left:1ex;
}
#haut a{
text-decoration:none;
background:transparent;
}

/* style du contenant
-------------------------------------------------------- */
#contenant{
float : left;
width:45em;
margin-right : 0px;
}

/* style du contenu
-------------------------------------------------------- */
#contenu{
margin:0 0 0 10ex;
}

/* contenu: style des articles
-------------------------------------------------------- */
.post{
margin:0 0 2.5em 0;
padding-left:2ex;
position:relative;
}
.day-date{
margin:0;
background:transparent;
text-align:right;
width:10ex;
position:absolute;
left:-13ex;
font-size:90%;
}
html>body .day-date{
left:-11ex;
}
.post h2{
margin-bottom:0;
}
.post h2 a{
background:transparent;
text-decoration:none;
}
.post-info{
font-size:0.85em;
margin:0;
}
.post-chapo{
margin-bottom:2em;
}
.post-contenu{
text-align:justify;
}
.com-info{
font-size:0.85em;
clear:both;
padding-left:13px;
}

/* contenu: style des commentaires et rétroliens
-------------------------------------------------------- */
#trackbacks{
margin-left:2ex;
margin-top:2em;
}
#comments{
margin-left:2ex;
margin-bottom:1em;
margin-top:2em;
}
.comment-info{
padding-left:13px;
}
#comments blockquote{
margin-left:1ex;
margin-bottom:2em;
padding-left:1ex;
}

/* style du menu
-------------------------------------------------------- */
#menu{
margin-left:47em;
margin-right:1em;
}
#menu h2{
font-size:1.1em;
color:inherit;
padding:3px;
}
#menu ul{
list-style:none;
list-style-image:none;
margin:0;
padding:0;
}
#menu ul li{
margin:1ex 0;
}
#menu ul li a{
text-decoration:none;
}

/* menu: style des blocs
-------------------------------------------------------- */
#calendrier{
text-align:center;
}
#calendrier h2{
display:none;
}
#calendrier a{
text-decoration:none;
}
#calendrier table{
font-size:0.8em;
margin:0 auto;
width:14em;
}
#calendrier caption{
padding:0 0 0.3em 0;
font-size:1.2em;
margin:0 auto;
}
#calendrier abbr{
border:none;
}
#calendrier th{
font-style:normal;
}
#calendrier td{
text-align:center;
}
#calendrier td a{
font-weight:bold;
display:block;
}

/* style du pied de page (bas)
-------------------------------------------------------- */
#bas{
margin:0;
padding:1ex 1em;
clear:left;
}
#bas ul{
clear:both;
margin:5px;
padding:0;
}
#bas li{
display:inline;
list-style-type:none;
}
#bas a{
text-decoration:none;
}


Jaimerais mettre une icône avec le titre du blog
et centrer ma page où j'écrit mes articles.

Mes problèmes: connaît pas l'anglais n'y l'écriture CSS.

Pour me simplifier la tâche, j'aimerais que vous me mettiez
en gras les zones à changer et ecrire à côté les changements.

Merci infiniment

[url]http://coupdepouce.mabulle.com/url]Coupdepouce[/url]
Afficher la suite 

4 réponses

Meilleure réponse
Messages postés
5153
Date d'inscription
mercredi 20 juillet 2005
Statut
Contributeur
Dernière intervention
7 août 2008
3532
2
Merci
En y regardant d'un peu plus près, tu pourrais apporter ces modifications (en gras) à ton fichier css et à ta page html.

Dans “style_core.css” :
/* style de la page
-------------------------------------------------------- */
#page{
    width:65em;
    margin:0 auto;
    text-align : center;
    padding:0;
    background-repeat:repeat-y;
    background-position:46em 0;
    }
#conteneur {
    text-align : left;
    }
/* style de l'entête (haut)
-------------------------------------------------------- */

Dans le document html :
  <body>
    <div id="page">
    <div id="conteneur">
      <div id="haut">
    …
    …
    …
    …
    …
    …
      </div>
    </div>
    </div>
    <script type="text/javascript" src="/edition/visa/stats/cdata.js">
    </script>
  </body>


Bon, la conception de ta page fait que ça donne maintenant un rendu bizarre…

Dire « Merci » 2

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 56281 internautes nous ont dit merci ce mois-ci

Messages postés
5153
Date d'inscription
mercredi 20 juillet 2005
Statut
Contributeur
Dernière intervention
7 août 2008
3532
1
Merci
Bonjour,

Modifier ta feuille de styles ne suffira pas.
Il faut aussi que tu modifies le document html.

Différentes manières de faire ont été évoquées >ici<.

+ Pour des liens corrects dans ce forum : Guide d'utilisation et “Mettre un lien hypertexte…”.
1
Merci
salut,svl je veux connaître quels sont les avantages de l'utilisation des feuilles de style CSS?merci à l'avance
c'est pour l'accessibilité de ton site. c'est des normes, il faut séparer le code source de la mise en forme
0
Merci
Y a ta "bulle" qui te dit que tu es hors ligne ;-)