Mettre un fond en css zone limité

livie -  
 livie -
Bonjour,


Je siu en train de faire un site via Wordpress.
J'aimerais pouvoir mettre un fond autour de tous ces éléments ( voir image)

http://imageshack.us/photo/my-images/818/sieqj.jpg/

Quel code dois je utiliser ? ou l'insérer dans le css ?

<config>Windows XP / Firefox 3.6.27</config>

Merci d'avance

2 réponses

Réponse 1 / 2
NDOUKI Messages postés 110 Date d'inscription   Statut Membre Dernière intervention   12
 
slt,
tu cherche les styles attribués à la balise Body dans ton fichier css
et tu modifie la propriété background-image en lui donnant le chemin de ton fichier arrière plan
0
Réponse 2 / 2
livie
 
b justement je comprend pas car je pense que l'endroit ou l'article que j'écris se met et celui des commentaire n'est dans la même balise css (j'espère que je ne me trompe pas, surtout au niveau des termes techniques)

Voici le code: 

/*   
Theme Name: Picture Perfect 
Theme URI: http://mac-host.com/support 
Description: A crisp black and white design that looks like a traditional webpage, not a wordpress blog.  Support and forums to help you get started at http://mac-host.com/support 
Version: 1.3.3 
Author: Wayne Connor 
Author URI: http://www.macintoshhowto.com/ 
Tags: black, white, two-columns, flexible-width, photoblogging, dark, right-sidebar 

*/ 



* { margin: 0; padding: 0; list-style: none; } 

/*   fond du blog  
Change le texte de tous les titres y compris celui des widget (mis a part le recherche) */ 

body { 
 text-align: center; 
 color: #EF7E4E; 
        font-size: 15px; 
        font-weight: none; 
 font-family: "High Tower Text", "Lucida Grande",Tahoma,"Lucida Sans Unicode",Verdana,sans-serif; 
 background-image:url(http://wallpapers.manbiz.eu/wallpapers/poppy_flowers-1280x800.jpg);  
background-attachment:fixed; 

  min-width:1024px;  
} 

/* couleur des liens sur le body: edit this entry olivia logout */ 
body a { 
  color: #EF7E4E; 
 text-decoration: none; 
} 

body a:hover{ 
 color: #F19269; 
 text-decoration: underline overline; 
} 


/* ? */ 
#upperBar { 
 height: 0px; 
 background: #ffffff; 
} 


/*titre des pages et décoration trait des images menu plus le recherche plus le "no replies " */ 
#wrapper { 
text-align: center; 
font: 15pt "High Tower Text", "Trebuchet MS", "Lucida Grande", Lucida, Vernada, sans-serif; 
position: relative; 
color: #F4A684; 
 margin: 20px auto 0; 
 width: auto; 
}     



#welcomeheading a { 
  
        text-align: center; 
 margin-bottom: 10px; 
 padding-bottom: 15px; 
 font: 40pt "High Tower Text", "Trebuchet MS", "Lucida Grande", Lucida, Vernada, sans-serif; 
 padding-top: 30px; 
 color: #F19269; 
 text-decoration: none; 
} 

#welcomeheading { 
  
 text-align: center; 
 position: absolute; 
 margin-left: 300px; 
 margin-right: 0; 
         
} 

#welcomeheading a:hover { 
 color: #F4A684; 
text-decoration: none; 

} 

/* ? */ 
#middleword { 
 color: #F19269; 
} 

#welcomeheading a:hover #middleword { 
 color: #F4A684; 
} 
  
 /* description du site sous le titre */ 
#description { 
 text-align: center; 
 font: normal 14px "High Tower Text",Verdana, Helvetica, Sans-serif; 
 color: #7BBA2E; 
 padding-bottom: 5px; 
 padding-top: 10px; 
}   


/* margin left: déplace le coté droit du cadre article sur la droite etc */        
          
#content { 
 margin-left: 350px; 
 margin-right: 280px; 
 float: none; 
 padding-top: 100px; 
 display: block; 

  
# 

} 

 #content .notice p { 
  border-top: 1px solid #bbb; 
  border-bottom: 1px solid #bbb; 
  padding: 5px 0px; 
  font-size: 12px; 
 margin: 1px; 
  
} 
  #content .notice { 

 margin-bottom: 20px; 
} 

    #content .post { 

 padding-top: 10px; 
  -webkit-border-radius: 6px; 
 -khtml-border-radius: 6px; 
 -moz-border-radius: 6px; 
 border-radius: 6px; 
  

background-color: rgba(230, 239, 220, 0.6); 
filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#7F00FF00', EndColorStr='#7F00FF00'); 



 border: 1px solid #381605; 
 padding: 10px; 
 margin-top: 70px; 
 margin-bottom: 100px; 
  
} 

   #content form  { 
 padding-right: 5px; 
 padding-left: 5px; 
} 

/* ? */ 
 #content h1 { 
 color: #381605; 
 text-decoration: none; 
 font-size: 22px; 
 font-weight: bold; 
 padding-bottom: 20px; 
} 

#content h1, #content h2, #content h3 { 
 padding-bottom: 8px; 
} 

/* Couleur des titre lien des articles */ 
 #content .post h2 a { 
 color: #F4A684; 
 text-decoration: none; 
 padding: 3px 0 8px; 
 font-size: 20px; 
 font-weight: none; 
} 


/* Couleur a hover des tire lien des articles */ 
 #content .post h2 a:hover { 
  color: #F29871; 
                text-decoration: none; 
 } 
  

/* les mot posted by on tel jour de chaque article */ 
 #content .post h3 { 
  font-size: 15px; 
  font-weight: normal; 
  color: #F29871; 
   margin-bottom: 0px; 
 margin-top: 5px; 
 padding-bottom: 8px; 
} 


/* liens des articles vers la catégorie le nombre de commentaire et le prochain post */  
 #content .post h3 a { 
  color: #381605; 
 }               
  
 #content .post h3 a:hover { 
  text-decoration: underline overline; 
 color: #381605; 
} 
  
 #content .post img { 
 margin-bottom: 10px; 
 margin-top: 10px; 
}      

#content .post .gallery { 
 overflow: auto; 
} 

.aligncenter, 
div.aligncenter { 
   display: block; 
   margin-left: auto; 
   margin-right: auto; 
} 

.alignleft { 
   float: left; 
} 

.alignright { 
   float: right; 
} 


/* ?  */ 
.wp-caption { 
   border: 1px solid #ddd; 
   text-align: center; 
   background-color: #000000; 
   padding-top: 4px; 
   margin: 10px; 

   /* optional rounded corners for browsers that support it */ 
   -moz-border-radius: 3px; 
   -khtml-border-radius: 3px; 
   -webkit-border-radius: 3px; 
   border-radius: 3px; 
} 

.wp-caption img { 
   margin: 0; 
   padding: 0; 
   border: 0 none; 
} 

/* ? */ 
#content p.wp-caption-text   
   { 
   font-size: 11px; 
   line-height: 17px; 

   margin: 10px; 
 color: #FECFD1; 
 text-align: center; 
} 
  
 #content .post a img { 
 } 
   
 #content .post ul { 
  margin-left: 20px !important; 
 } 
  
 #content .post ul li { 
  list-style-type: disc !important; 
 } 
  
/* couleur et police des texte des articles et commentaires */ 

 #content p, 
 #content .post ul li { 
  font: normal 17px "High Tower Text", Verdana, Helvetica, Sans-serif; 
  margin-bottom: 10px; 
  margin-top: 10px; 
 color: #1F0C03; 
 margin-right: 0px; 
 text-align: justify; 
} 
  
 #content blockquote { 
 margin-left: 10px; 
 padding-left: 10px; 
 font-style: italic; 
 color: #1F0C03; 
 background: #F4A684; 
 padding: 2px 6px; 
  
} 
  
 #content p a { 
} 
  
 #content p a:hover { 
  text-decoration: underline overline; 
 color: #F4A684; 

}  
  



 #content small { 
     margin: 0 auto; 
     text-align: center; 
     display: block; 
     border-top: 3px solid #333; 
     border-bottom: 1px solid #333; 
     font-size: 11px; 
     color: #F4A684; 

 } 
  
 #content ol { 
 line-height: 1.6; 
} 
 #content ol.commentlist { 


  margin-top: 10px; 
 } 
  
 #content ol.commentlist li { 
  margin-bottom: 10px; 
  display: inline-block; 
 margin-top: 20px; 
}  
  
  #content ol.commentlist li .commentMeta { 
   width: 140; 
   float: left; 
   margin-top: 5px; 
  }  
   
      #content ol.commentlist li .commentMeta span { 
    display: block; 
   } 
    
   #content ol.commentlist li .commentMeta span.author, 
   #content ol.commentlist li .commentMeta span.author a { 
    color: #F4A684;     
    text-decoration: none; 
    margin-bottom: 5px; 
   }                      
    
   #content ol.commentlist li .commentMeta span.date a { 
    color: #F4A684; 
    text-decoration: none; 
    font-size: 11px; 
   } 

   
  #content ol.commentlist li .commentText { 
   width: 400px; 
   float: right; 
   font-size: 12px; 
                padding-left: 20px; 
} 
  
  
 #content ol.commentlist .avatar { 
float: left; 
} 
/* texte: leave a reply */ 

 #content h3 { 
  color: #381605; 
font-size: 22px; 
text-align: left; 


 } 
  
/* bouton envoyé */ 
 #content #commentform input { 
  padding: 1px; 
                 color: #1F0C03; 
                background: #F4A684; 
  font-family: Arial, Helvetica, Sans-serif; 
 } 
  
/* zone de saisie de commentaire */ 
 #content #commentform textarea { 
  width: 300px; 
                 height: 55px; 
  padding: 0px; 
  font-family: Arial, Helvetica, Sans-serif; 
                color: #1F0C03; 
                background: #F4A684; 
                 
 } 
  
 #content .nextprevious { 
 height: 40px; 
 display: block; 
 margin-top: 20px; 
 font: normal 13px/20px Verdana, Helvetica, Sans-serif; 
}  

/* ? */ 
 #content .nextprevious a { 
 color: #1F0C03; 
}                
  
 #content .nextprevious .left { 
  float: left; 
 }               
  
 #content .nextprevious .right { 
  float: right; 
 } 
  
 #content .adBrite { 
  display: block; 
  margin-bottom: 20px; 
  border: 1px solid #333; 
 } 

/* ? */ 
#sitemeter { 
 text-align: center; 
 width: 160px; 
  font-size: 11px; 
  color: #EF7E4E; 
} 
#sitemeter img{ 
 padding-bottom: 8px; 
 padding-top: 8px; 
} 

/* sidebar: partie widget et bloc de droite*/ 

#sidebar { 
 width: 180px; 
 float: right; 
 text-align: left; 
 margin-right: 20pt; 
 padding-top: 100px; 
 display: inline; 
}  



#sidebar li{ 
 padding-left: 11px; 

} 

div#sidebar > li { 
 -webkit-border-radius: 6px; 
 -khtml-border-radius: 6px; 
 -moz-border-radius: 6px; 
 border-radius: 6px; 
 margin-top: 20px; 


background-color: rgba(230, 239, 220, 0.6); 
filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#7F00FF00', EndColorStr='#7F00FF00'); 
  
 border: 1px solid #381605; 
 padding: 10px; 
         

} 

/* texte de la side bar */ 
 #sidebar h2 { 
  font-weight: bold; 
  font-size: 16px; 
                color: #381605;  
  text-transform: none; 
  margin-bottom: 10px; 
 padding-top: 8px; 
} 
  
 #sidebar a img { 
  border: none; 
 } 
  

 #sidebar ul { 
  margin-top: 10px; 
  margin-bottom: 10px; 

 text-decoration: none; 
} 
 /* taille du texte de la side bar */ 
 #sidebar ul li { 
  font-size: 15px; 
                 
  padding: 0 10px; 
  margin: 0 0 5px 5px; 
   text-decoration: none; 
 } 
  
/* couleur liens widget */ 
 #sidebar ul li a { 
  color: #F19269; 
  text-decoration: none; 
 } 
  
 #sidebar ul li span { 
  color: #F4A684; 
  margin-left: 5px; 
 } 
  
 #sidebar ul li a:hover { 
  color: #F4A684; 
 text-decoration: underline overline; 
} 
  
 #sidebar ul#nav { 
  margin: 10px 0 20px 0; 
 } 
  
 #sidebar ul#nav li { 
  margin: 0; 
  padding: 0; 
 } 
   
 #sidebar ul#nav li a { 
  display: block; 
  height: 17px; 
  padding: 7px 10px; 
  background: url(img/nav_off.png) 0 0 no-repeat; 
  margin-bottom: 5px; 
  text-decoration: none; 
  font-size: 12px; 
  text-transform: uppercase; 
  font-weight: bold; 
  color: #999; 
 } 
  
 #sidebar ul#nav li a:hover { 
  background: url(img/nav_off.png) 0 -31px no-repeat; 
 }         
  
 #sidebar ul#nav li a.active { 
  background: url(img/nav_on.png) 0 0 no-repeat; 
  color: #FFF; 
 } 


#footer hr { 
height: 1px; 
} 


div#footer { 
    font-size: 11px; 
 float: none; 
 clear: left; 
 -moz-border-radius: 6px; 
   -khtml-border-radius: 6px; 
   -webkit-border-radius: 6px; 
   border-radius: 6px; 
 border: 0px solid ; 
 background-color: ; 
 padding: 5px 0 2px; 
 position: relative; 
 margin: 10px 240px 20px 300px; 
} 
#footer p { 
        margin-bottom: 5px; 
        color: #F4A684; 
 text-align: center; 
} 
     
#footer a { 
        color: #F4A684; 
 text-decoration: none; 
} 
     
#footer a:hover { 
        text-decoration: none; 
        color: #F4A684; 
    } 

.clearfix { 
 clear: both; 
}  

.ctc { 
text-align: center; 
 text-decoration: none; 
 line-height: 80%; 
 background-color: #000; 
 margin-bottom: 10px; 
 padding-right: 10px; 
 padding-top: 0px; 
 padding-bottom: 10px; 
}  


.ctc a { 
 text-decoration: none; 
 text-transform: lowercase; 
 font-family: "Lucida Grande",Tahoma,"Lucida Sans Unicode",Verdana,sans-serif; 
 margin: 4px; 
 border: thin none #060606; 
} 
.ctc a:hover{ 
 color: #fff; 
 margin: 3px; 
 border: thin solid #8acef3; 
 background-color: #0c0c0c; 
} 

[disabled] { 

 color:#000000; 

 border-color:#dddddd!important; 

 background:none!important; 

} 

 #upperBox { 
 margin-bottom: 10px; 
 text-align: center; 
 position: absolute; 
 right: 0; 
 padding-top: 5px; 
} 
  
 #upperBox a img { 
  display: block; 
  margin: 0 auto; 
  border: none; 
 } 
  

  #upperBox p { 
  margin: 5px 0; 
  font-size: 10px; 
  text-align: center; 
 } 
  
  #upperBox input { 
  height: 18px; 
  padding: 5px 5px 5px 25px; 
  background: url(img/upperBox_search.png) top left no-repeat; 
  border: 0; 
  width: 100px; 
  color: #000000; 
  margin-top: 5px; 
 } 
  
  #upperBox input:focus { 
  color: #000000; 
 } 




.clear { 
 clear: both; 
}
0

Discussions similaires

Family link : les temps ne correspondent pas !
Barfly -
Aure -

5 réponses
Erreur la zone de données passée à un appel système est insu
Vincent -
Panth33ra -

5 réponses
additionner nombres dans cellules avec texte
kawimaki -
kawimaki -

6 réponses
détail facture sfr data ?
BONO -
f76 -

9 réponses
Limite de demande d’amis Snapchat comment faire ?
Tom -
a.privaxx54 -

2 réponses