Changer couleur liens, titre du sujet + cadre des catégories

2 participants

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Changer couleur liens, titre du sujet + cadre des catégories

Message par Khayalan Mer 27 Fév 2013 - 20:53

Bonsoir,

Mon fond de page est de couleur claire et l'image du cadre de mes catégories plutôt sombre, ce qui entraine quelques problèmes de lisibilité...

Je souhaiterais:
- mettre en blanc le titre du sujet ouvert en haut et en bas (souligné en vert)
- mettre en blanc le cadre actuellement noir autour du sujet (le cadre extérieur du tableau, celui qui coupe l'image du cadre de mes catégories)
- mettre en blanc les liens de navigation sous les permissions (souligné en vert) sans toucher à ceux qui se trouvent au-dessus de la structure des forums

Capture:

Changer couleur liens, titre du sujet + cadre des catégories Apb10

Je précise que mon CSS est terriblement bricolé ("catégories en bloc"), mais je peux le fournir si vous en avez besoin.

Merci d'avance Wink


Dernière édition par Khayalan le Ven 1 Mar 2013 - 10:27, édité 1 fois
avatar

Khayalan
**

Messages : 98
Inscrit(e) le : 09/02/2013

http://equid-et-wow.forumactif.org/
Khayalan a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Changer couleur liens, titre du sujet + cadre des catégories

Message par Matriochka Jeu 28 Fév 2013 - 9:58

Bonjour,

Alors alors…

Titre du sujet en blanc :
Code:
.catHead h1 {color:#FFFFFF;}

Bordures en blanc :
Code:
.catHead {border-color:#FFFFFF!important;}

Liens de navigation en blanc :
Code:
a.nav {color:#FFFFFF!important;}

Tout ç à ajouter évidemment dans ton CSS Wink
avatar

Matriochka
Membre actif

Messages : 7604
Inscrit(e) le : 14/07/2010

Matriochka a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Changer couleur liens, titre du sujet + cadre des catégories

Message par Khayalan Jeu 28 Fév 2013 - 18:36

Merci de ta réponse!

Ci-joint une capture du résultat.

- Pour le titre du sujet en haut, c'est parfait, j'aimerais juste faire pareil en bas (entouré en rouge) si c'est possible

- Pour le cadre, je trouve que c'est plus esthétique, mais est-ce possible de faire pareil sur tous les cadres extérieurs (approximativement) repassés en rouge)

- Pour les liens de navigation, c'est super en bas mais je voudrais qu'ils restent noirs en haut (zone surlignée en jaune) parce que blanc sur beige, on ne voit rien...

Voici la capture:

Changer couleur liens, titre du sujet + cadre des catégories Apb11

Et mon css:

Code:
a.mainmenu{
   font-size: 11px;
   color: #000000;
   font-weight: bold;
   text-decoration: none;
   margin-left : 9px;
   margin-right : 9px;
   text-align: center;
   text-transform: uppercase;}

a.mainmenu:hover{
   font-size: 11px;
   color: #000000;
   font-weight: bold;
   text-decoration: none;
   margin-left : 9px;
   margin-right : 9px;
   text-align: center;
   text-transform: uppercase;
   font-style: italic;
        border-bottom: 1px dotted #000000;}

a {font-variant: small-caps;}
a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:hover {text-decoration: none;
font-style: italic;
cursor: se-resize;}

a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:hover {text-decoration: NONE !important;}
a:active {text-decoration: none;}

body{
   cursor:crosshair;}

.forumline {
   -moz-border-radius:30px;
   -webkit-border-radius:30px;
   -moz-box-shadow: 5px 5px 7px #787878;
   background-image:url("http://i77.servimg.com/u/f77/18/10/66/85/denim-10.gif");
   padding:10px;}

td.row3,td.row1,td.row2,td.row3Right {
   background-image:url(http://s2.noelshack.com/old/up/antiinvite-b8c6c0cf17.png);}

.bodyline{
   background-image: url(http://s2.noelshack.com/old/up/antiinvite-b8c6c0cf17.png);
   -moz-box-shadow: 1px 1px 7px #787878;
   -moz-border-radius-bottomleft:100px;
   -moz-border-radius-bottomright:100px;
   -moz-border-radius-topleft:30px;
   -moz-border-radius-topright:30px;}

a.forumlink {
   font-size: 17px;color: #14695b;
   text-align:center;
        display:block;
        letter-spacing:-1px;
        padding-right:20px;
   font-family: times new roman;
   text-transform:lowercase;
        font-style:oblique;
        border-bottom: 1px dashed #14695b;}

input,textarea, select {
   font: normal 11px;
   background-image: url(http://s2.noelshack.com/old/up/antiinvite-b8c6c0cf17.png);
   border: 1px #b3964b solid;
   border-left-width: 1px;
   border-top-width: 1px;
   border-right-width: 1px;
   border-bottom-width: 1px}

input.post, textarea.post, select{
   ;font-size:11px;
   background-image: url(http://s2.noelshack.com/old/up/antiinvite-b8c6c0cf17.png);
   border: 1px #b3964b solid;}

input {
   font-size: 11px;text-indent : 2px;
   background-image: url(http://s2.noelshack.com/old/up/antiinvite-b8c6c0cf17.png);
   border: 1px #b3964b solid;}

input.button {
   font-size: 11px;
   font-family:Tahoma,Helvetica,sans-serif;
   background-image: url(http://s2.noelshack.com/old/up/antiinvite-b8c6c0cf17.png);
   border: 1px #b3964b solid;}

input.mainoption {
   font-weight : bold;
   background-image: url(http://s2.noelshack.com/old/up/antiinvite-b8c6c0cf17.png);
   border: 1px #b3964b solid;}

input.liteoption {
   font-weight : normal;
   background-image: url(http://s2.noelshack.com/old/up/antiinvite-b8c6c0cf17.png);
   border: 1px #b3964b solid;}

.code {
   background-image:url(http://s2.noelshack.com/old/up/antiinvite-b8c6c0cf17.png);
   padding:10px;
   text-align:justify;
   font-size:12px;
   -moz-box-shadow: 1px 1px 7px #787878;
   -moz-border-radius:30px;
   max-height: 180px;
   overflow: auto;
   border: 5px #263D4C solid;}

.spoiler {
   background-image:url(http://s2.noelshack.com/old/up/antiinvite-b8c6c0cf17.png);
   padding:10px;
   text-align:justify;
   font-size:12px;
   -moz-box-shadow: 1px 1px 7px #787878;
   -moz-border-radius:30px;
   max-height: 180px;
   overflow: auto;
   border: 5px #263D4C solid;}

.quote {
   background-image:url(http://s2.noelshack.com/old/up/antiinvite-b8c6c0cf17.png);
   padding:10px;
   text-align:justify;
   font-size:12px;
   -moz-box-shadow: 1px 1px 7px #787878;
   -moz-border-radius:30px;
   max-height: 180px;
   overflow: auto;
   border: 5px #263D4C solid;}
.postbody {
padding-left: 15px;
}
.postbody {
padding-right: 15px;
}
.signature_div img {
  max-height:100px;
  max-width:500px;
}
 
/* ************* CENTRER LES SIGNATURES *********** */
.signature_div { text-align: center; }
a.mainmenu {margin-right:-12px !important;}
.bodylinewidth {
border-spacing: 0;
}
.bodyline{
border-spacing: 0;
}

/* ---- BLOC CONTENANT LE TITRE DES CATÉGORIES ---- */
.tfa_cattitle{
position: relative;
width: 100%;
margin: 15px 0;
padding: 0;
clear:both;
}
/* TITRE CATÉGORIE */
.tfa_cattitle h2{
width: 80%;
margin: 0 auto;
paddign: 0;
text-align:center;
font: 22px small-caps;
color: #013968;
text-shadow: 0 1px 0 #000;
}

/* ---- BLOC CONTENANT LES FORUMS ---- */
.tfa_container_forum{
position: relative;
width: 100%;
margin: 10px auto;
padding: 0;
}
/* BLOC CONTENANT UN FORUM */
.tfa_contenu_forum{
width: 50%;
float: left;
margin: 10px auto 30px;
padding: 0;
}
/* CONTENU DES FORUMS */
.in_forum{
position: relative;
width: 96%;
margin: 10px auto;
padding: 0;
background-image:url("http://i77.servimg.com/u/f77/18/10/66/85/denim-10.gif");
margin: 0 auto;
padding: 0px;
border: 2px solid #000000;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
}

/* ----- BLOC SUJETS-MESSAGES ------ */
.sujets-messages{
background: url(http://i45.servimg.com/u/f45/11/95/30/70/258.png) repeat-x transparent;
position: relative;
width: 190px;
height: 16px;
margin: 0 auto;
padding:0;
text-align:center;
}
/* SUJETS-MESSAGES */
.sujets-messages .gensmall{
font: 10px small-caps;
color: #fff;
text-shadow: 1px 0 1px #000;
margin: 2px auto 0;
padding:0;
text-align: center;
}
/* CHIFFRES */
.chiffres{
color:#0036d0;
}

/* ------- BLOC TITRE FORUM ------- */
.block_titre{
background: url(http://i77.servimg.com/u/f77/18/10/66/85/barre411.jpg) top left repeat-x;
position:relative;
width: 100%;
height: 50px;
margin: 10px 0 0 0;
padding: 0;
}
.block_titre .hierarchy{
display: block;
width: 100%;
height: 33px;
margin: 0;
padding: 0;
}
/* LIEN FORUM */
.block_titre a.forumlink{
display: block;
font: bold 16px small-caps;
color: #ffffff;
text-shadow: 0 0px 0 #d4c5ac;
text-align: center;
padding-top: 6px;
text-decoration: none !important;
-webkit-transition: all 0.8s ease 0.2s; /* pour navigateur webkit */
-moz-transition: all 0.8s ease 0.2s; /* pour navigateur mozilla */
-o-transition: all 0.8s ease 0.2s; /* pour navigateur opera */
transition: all 0.8s ease 0.2s; /* pour les navigateurs récents */
}
/* LIEN FORUM AU SURVOL */
.block_titre a.forumlink:hover{
font-size: 19px;
color: #ffffff;
text-decoration: none !important;
}
/* IMAGE DE GAUCHE */
.titre-deco{
position: absolute;
top: 0;
left: 0;
width: 25px;
height: 33px;
margin: 0;
padding: 0;
}

/* ------- BLOC DESCRIPTION -------- */
.tfa_description{
background: url(http://s2.noelshack.com/old/up/antiinvite-b8c6c0cf17.png) top left repeat-x transparent;
border: 1px solid #e5d6bd;
width: 94%;
height: 80px;
margin: 12px auto 0;
padding: 0;
}
/* BLOC TRANSITION */
.bloc-trans{
position: relative;
height: 80px;
margin: auto;
overflow: hidden;
width: 100%;
margin: 0;
padding: 0;
}
/* CONTENU BLOC DESCRIPTION */
.bloc-texte{
background: #25211b;
width: 100%;
height: 80px;
position: absolute;
top: 0;
left: 0;
color: #9C9C9C;
opacity: 0;
filter : alpha(opacity=0);
-webkit-transition: all 1.5s ease; /* pour navigateur webkit */
-moz-transition: all 1.5s ease; /* pour navigateur mozilla */
-o-transition: all 1.5s ease; /* pour navigateur opera */
transition: all 1.5s ease; /* pour les navigateurs récents */
}
/* DESCRIPTION AU SURVOL */
.bloc-texte:hover {
opacity: 0.8;
filter : alpha(opacity=80);
}
/* IMAGE DESCRIPTION */
.descr-img img {
vertical-align: middle;
}
/* TEXTE DESCRIPTION */
.in-tfa_cont{
font-size: 12px;
color: #fff;
text-align: center;
width: 96%;
margin: 5px auto 0;
padding:0;
height: 68px;
overflow-y: auto;
}

/* ------ BLOC MODERATEURS -------- */
.modo{
position: relative;
width:90%;
margin: 0 auto;
padding: 0;
}
.modo-transtion{
position: absolute;
left: 0;
width: 100%;
margin: 0 auto;
padding: 0;
z-index: 3;
}
/* CONTENU MODERATEURS */
.modo_content{
background: url(http://i45.servimg.com/u/f45/11/95/30/70/zeza11.jpg) repeat-x;
position: relative;
height: 0;
overflow: hidden;
color: #fff;
-moz-border-radius: 0 0 9px 9px;
-webkit-border-radius: 0 0 9px 9px;
border-radius: 0 0 9px 9px;
-webkit-transition: all 1.2s ease; /* pour navigateur webkit */
-moz-transition: all 1.2s ease; /* pour navigateur mozilla */
-o-transition: all 1.2s ease; /* pour navigateur opera */
transition: all 1.2s ease; /* pour les navigateurs récents */
}
/* OUVERTURE MODERATEURS */
.open_modo{
background: url(http://i45.servimg.com/u/f45/11/95/30/70/mo10.png) no-repeat transparent;
position: relative;
width: 94px;
height: 13px;
display: block;
margin: 0 auto;
padding: 0;
font: 10px small-caps;
color: #fff;
text-shadow: 1px 0 1px #000;
text-align: center;
}
/* MODERATEURS AU SURVOL */
.modo-transtion:hover .modo_content{
height: 25px;
padding: 3px;
}

/* TEXTE MODO */
.modo span{
font: 10px small-caps;
}

/* --- PARTIE DERNIERS SUJETS ET ICONES */
.derniers_sujets_and_icone{
width: 100%;
position: relative;
margin: 0;
padding: 0;
}
/* ---------- DERNIERS SUJETS -------- */
.tfa_last_post{
background: url(http://s2.noelshack.com/old/up/antiinvite-b8c6c0cf17.png) top left repeat-x transparent;
width: 65%;
height: 60px;
float: left;
margin: 16px 0 10px 10px;
padding: 5px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
border: 1px solid #817663;
border-bottom: 1px solid #daceba;
-webkit-transition: all 1.2s ease; /* pour navigateur webkit */
-moz-transition: all 1.2s ease; /* pour navigateur mozilla */
-o-transition: all 1.2s ease; /* pour navigateur opera */
transition: all 1.2s ease; /* pour les navigateurs récents */
}
/* DERNIERS SUJETS AU SURVOL */
.tfa_last_post:hover{
background-position: bottom left;
}
/* ICONES NEW-NO NEW-CLOS */
.tfa_icone{
width: 25%;
float: right;
margin: 10px auto;
padding: 0;
text-align: center;
}

/* ------ BLOC SOUS-FORUMS -------- */
.bas-tfa_transition{
position: relative;
width:90%;
margin: 0 auto;
padding: 0;
}
.bloc_sous_forums{
position: absolute;
left: 0;
width: 100%;
margin: 0 auto;
padding: 0;
z-index: 3;
}
/* SOUS-FORUMS */
.sous_forums{
background: url(http://i45.servimg.com/u/f45/11/95/30/70/zeza11.jpg) repeat-x;
position: relative;
height: 0;
overflow: hidden;
color: #ffffff;
-moz-border-radius: 0 0 9px 9px;
-webkit-border-radius: 0 0 9px 9px;
border-radius: 0 0 9px 9px;
-webkit-transition: all 1.2s ease; /* pour navigateur webkit */
-moz-transition: all 1.2s ease; /* pour navigateur mozilla */
-o-transition: all 1.2s ease; /* pour navigateur opera */
transition: all 1.2s ease; /* pour les navigateurs récents */
}
/* OUVERTURE SOUS-FORUM */
.open_sous-forums{
background: url(http://i45.servimg.com/u/f45/11/95/30/70/258.png) no-repeat transparent;
position: relative;
width: 149px;
height: 17px;
display: block;
float: right;
margin-right: 10px;
padding: 1px 0 0 0;
font: 11px small-caps;
color: #fff;
text-shadow: 1px 0 1px #000;
text-align: center;
}
/* SOUS-FORUM AU SURVOL */
.bloc_sous_forums:hover .sous_forums{
height: 50px;
padding: 3px;
}

#le_tableau{
color:#435250;
font-size: 12px;
font-family: Arial;
text-align: center;
background: url("http://i77.servimg.com/u/f77/18/10/66/85/denim-10.gif");
border: 3px solid #274b6b;
margin: 3px;
-moz-border-radius: 12px ;
-webkit-border-radius: 12px;
border-radius: 12px;
-moz-box-shadow: 2px 2px 2px #000;
-webkit-box-shadow: 2px 2px 2px #000;
box-shadow: 2px 2px 2px #000;
-moz- text-shadow: 1px 1px 2px #000;
-webkit- text-shadow: 1px 1px 2px #000; 
}

.text_imag{
color: #d8f795;
text-align: center;
vertical-align: center;
font-family: Arial;
font-size: 30px;
font-weight: bold;
}

.style_cellule{
background-image: url(http://s2.noelshack.com/old/up/antiinvite-b8c6c0cf17.png);
border: 3px solid #274b6b;
margin: 3px;
padding: 6px;
-moz-border-radius: 12px ;
-webkit-border-radius: 12px;
border-radius: 12px;
-moz-box-shadow: 2px 2px 2px #000;
-webkit-box-shadow: 2px 2px 2px #000;
box-shadow: 2px 2px 2px #000;
}

#igauche{
background-image: url(http://s2.noelshack.com/old/up/antiinvite-b8c6c0cf17.png);
background-color: #0f100f;
border: 3px solid #274b6b;
padding: 6px;
-moz-border-radius: 12px ;
-webkit-border-radius: 12px;
border-radius: 12px;
-moz-box-shadow: 2px 2px 2px #000;
-webkit-box-shadow: 2px 2px 2px #000;
box-shadow: 2px 2px 2px #000;
}
#idroite{
background-image: url(http://s2.noelshack.com/old/up/antiinvite-b8c6c0cf17.png);
background-color: #0f100f;
border: 3px solid #274b6b;
padding: 6px;
-moz-border-radius: 12px ;
-webkit-border-radius: 12px;
border-radius: 12px;
-moz-box-shadow: 2px 2px 2px #000;
-webkit-box-shadow: 2px 2px 2px #000;
box-shadow: 2px 2px 2px #000;
}


.titre_4{
font-size: 14px;
color: #274b6b;
border-bottom: 1px dotted #274b6b;
}

/* navigation */

#nav-menu ul{
list-style: none;
padding: 0;
margin: 0;
}

#nav-menu li{
float: left;
margin: 0 2px;
}

#nav-menu li a{
height: 14px;
line-height: 14px;
float: left;
width: 138px;
display: block;
border: 2px solid 3e8dd1;
background-image: url(http://s2.noelshack.com/old/up/antiinvite-b8c6c0cf17.png);
font-size: 15px;
font-weight: bold;
text-decoration: none;
text-align: center;
-moz-border-radius: 12px 3px 12px 3px ;
-webkit-border-radius: 12px 3px 12px 3px ;
border-radius: 12px 3px 12px 3px ;
-moz-box-shadow: 2px 2px 2px #000;
-webkit-box-shadow: 2px 2px 2px #000;
box-shadow: 2px 2px 2px #000;
margin: 2px 0px 2px 0px;
}

#nav-menu li a:hover{
color: #bfcd48;
font-style: italic;
}

/* Hide from IE5-Mac \*/
#nav-menu li a{
float: none
}
/* End hide */


/* fin navigation */


/* Scroller Box */

#scroller_container {
width: 120px;
height: 70px;
overflow: hidden;
}

#dummy {;# }

#scroller_container {
overflow: auto;
}

/* fin Scroller Box */

/* infobulle */

div.info em {
display:none;
}

div.info:hover {
background: none;
z-index: 999;
cursor: hand;
position: relative;
text-decoration:none;
border: 0;
}

div.info:hover em {
font-style: normal;
font-size: 10px;
color:#000 !important;
padding: 3px;
display: inline;
position: absolute;
top: 62px;
left: 35px;
-moz-border-radius: 7px 7px 0px 7px ;
-webkit-border-radius: 7px 7px 0px 7px ;
border-radius:7px 7px 0px 7px ;
-moz-box-shadow: 0px 0px 4px #000;
-webkit-box-shadow: 0px 0px 4px #000;
box-shadow: 0px 0px 4px #000;
background-color: #424242;
border: 2px solid #00a200;
width:auto;
}

.titre_info{
text-align: center;
font-size: 14px;
font-style: italic;
border-bottom: 1px dotted #274b6b;
}

/* fin infobulle */
.bodylinewidth {
border-spacing: 0;
}
.bodyline{
border-spacing: 0;
}
a.cattitle {
    color: #FFFFFF;
}
.catHead h1 {color:#FFFFFF;}
.catHead {border-color:#FFFFFF!important;}
a.nav {color:#FFFFFF!important;}
.catFoot h1 {color:#FFFFFF;}

Merci encore, désolée d'être aussi perfectionniste...
avatar

Khayalan
**

Messages : 98
Inscrit(e) le : 09/02/2013

http://equid-et-wow.forumactif.org/
Khayalan a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Changer couleur liens, titre du sujet + cadre des catégories

Message par Khayalan Jeu 28 Fév 2013 - 21:11

Petit up pour la touche finale svp Wink
avatar

Khayalan
**

Messages : 98
Inscrit(e) le : 09/02/2013

http://equid-et-wow.forumactif.org/
Khayalan a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Changer couleur liens, titre du sujet + cadre des catégories

Message par Matriochka Ven 1 Mar 2013 - 9:45

Changer couleur liens, titre du sujet + cadre des catégories Send_210Je vous rappelle qu'il est autorisé un seul UP par tranche de 24 heures, à partir de votre dernier message posté dans le sujet concerné.

Je vous invite à lire :

Un peu de patience, on ne peut pas toujours être disponible Smile

Pour le titre du sujet en haut, c'est parfait, j'aimerais juste faire pareil en bas (entouré en rouge) si c'est possible
Pour ça, tu peux ajouter ceci :
Code:
.catBottom h1 {color:#FFFFFF;}

Pour le cadre, je trouve que c'est plus esthétique, mais est-ce possible de faire pareil sur tous les cadres extérieurs (approximativement) repassés en rouge)
Pour ça, ajoute :
Code:
.catHBottom {border-color:#FFFFFF!important;}

Pour les liens de navigation, c'est super en bas mais je voudrais qu'ils restent noirs en haut (zone surlignée en jaune) parce que blanc sur beige, on ne voit rien...
Pour ceci en revanche, la class nav est attribuée en haut comme en bas, donc le style appliqué sur l’un s’appliquera automatiquement à l’autre.
avatar

Matriochka
Membre actif

Messages : 7604
Inscrit(e) le : 14/07/2010

Matriochka a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Changer couleur liens, titre du sujet + cadre des catégories

Message par Khayalan Ven 1 Mar 2013 - 10:26

Bien sûr, désolée Wink

Nickel, merci pour tout!
avatar

Khayalan
**

Messages : 98
Inscrit(e) le : 09/02/2013

http://equid-et-wow.forumactif.org/
Khayalan a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum