Bon, j’ai commencé à remettre en place ma CSS d’avant.
Pour ce faire j’ai tout réécrit avec amour, et surtout en me disant toutes les trois minutes “a ouais je crois que je l’ai vu en cours ce truc, c’était quoi déjà?”.
Mon principale soucis est de gérer les zones transparentes, genre le footer en bas d’article “postmetadata”, zone de texte que d’ailleurs je n’arrive pas à décaler à droite (elle reste coller à gauche la pute).
J’ai néanmoins vaincu un certain nombre de probleme, comme l’encadré des images, qui marchait pas toujours, et d’autres bordels.
Et comme je suis sympa, voilà mon brouillon en cours, faut que je le change pour faire un truc propre et relisible!
/* Modifier la feuille de styles (CSS) - Écrivez votre propre feuille de style pour écraser celle du thème Wefrag Default Fr */
//C4EST MA MIENNE DE CSS, TU COPI PA§§§!!!§§
//CSS Wefrag du blog de ecaheti qui a bien galérer
// http://blogs.wefrag.com
#page
{
background-color: #ffffff ;
margin: 0px 0px 0px 0px ;
}
#p div.postmetadata
{
text-align: right ;
}
#page #header
{
background-image: url(http://pix.nofrag.com/8/0/7/19188188bc4c45c2358951ba4b253.png) ;
background-attachment: scroll ;
background-position: left top ;
background-repeat: repeat ;
height: 85px ;
padding-bottom : 15px ;
// padding: 1.5em 1em 0.4em 1em ;
border-top-color: #000000
border-top-width: 1 ;
border-top-style: solid ;
border-bottom-color: #000000 ;
border-bottom-width: 1 ;
border-bottom-style: solid ;
background-color: #ffffff ;
}
#page #footer
{
background-image: url(http://pix.nofrag.com/8/0/7/19188188bc4c45c2358951ba4b253.png) ;
background-attachment: scroll ;
background-position: left top ;
background-repeat: repeat ;
height: 100px ;
margin-top : 15px ;
// padding-bottom: 15px ;
border-top-color: #000000
border-top-width: 1 ;
border-top-style: solid ;
border-bottom-color: #000000 ;
border-bottom-width: 1 ;
border-bottom-style: solid ;
background-color: #ffffff ;
}
#body div.container
{
background: transparent;
}
#body div.post div.entry
{
background: transparent;
padding-bottom: 0px ;
}
#body div.post
{
margin-bottom: 50px ;
}
#body div.header h1
{
text-align: left ;
}
#body div.header div.description
{
text-align: left ;
}
#body div.header
{
background: transparent;
/* background-image: url(http://pix.nofrag.com/4/4/7/11b206dfad08a9334495467708401tt.jpg) ;
*/ background-image: url(http://uppix.net/2/a/b/5558cf83dd71024b686519d545374.png) ;
background-attachment: undefined ;
background-position: right center ;
background-repeat: no-repeat ;
height: 300px ;
padding: 0px 0px 200 0px ;
border-left-width: 0px ;
border-right-width: 0px ;
border-top-width: 0px ;
border-bottom-width: 0px ;
}
#header div.container
{
text-align: right ;
}
#sidebar div.content
{
background: transparent;
}
#sidebar
{
width: 150px;
background-image: url(http://uppix.net/8/d/f/1db4b5645fecbec5040004ed96a33.png) ;
background-attachment: scroll ;
background-position: center ;
background-repeat: repeat-y ;
border-left-color: #000000 ;
border-left-width: 4px ;
border-left-style: outset ;
border-right-color: #000000 ;
border-right-width: 4px ;
border-right-style: outset ;
border-top-color: #000000 ;
border-top-width: 4px ;
border-top-style: outset ;
border-right-style: outset ;
border-bottom-color: #000000 ;
border-bottom-width: 4px ;
border-bottom-style: outset ;
color: #990000 ;
}
#body div.post div.title, #body div.post
{
background: transparent;
border-left-width: 0px ;
border-right-width: 0px ;
border-top-width: 0px ;
border-bottom-width: 0px ;
}
#body div.post div.title h2
{
color: #660000 ;
text-align: left;
font-size: 20 px ;
margin: 0px 0px 0px 5px ;
background-image: url(http://pix.nofrag.com/f/6/f/40d8187d07ae0476fdef347ddda9a.png) ;
background-attachment: scroll ;
background-position: left bottom ;
background-repeat: no-repeat ;
padding: 16px 0px 0px 50px ;
border-bottom-color: #fffffe ;
border-bottom-width: 0 ;
}
#body div.post div.title small
{
margin: 0px 0px 0px 100px ;
}
body
{
background-color: #ffffff;
background-image: url(http://uppix.net/4/6/5/90881668f0eba58bdea19fc202262.png) ;
background-attachment: fixed ;
/* background-position: center bottom ; */
background-position: center ;
background-repeat: repeat ;
margin:0;
padding:0;
}
img, a img
{
/* padding: 7px 4px 4px 4px ;*/
border-left-color: #000000 ;
border-left-width: 4px ;
border-left-style: outset ;
border-right-color: #000000 ;
border-right-width: 4px ;
border-right-style: outset ;
border-top-color: #000000 ;
border-top-width: 4px ;
border-top-style: outset ;
border-right-style: outset ;
border-bottom-color: #000000 ;
border-bottom-width: 4px ;
border-bottom-style: outset ;
}
Voila, gros bisous et bonne nuit!