Barre de Navigation

3 participants

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

Résolu Barre de Navigation

Message par La Luna Mar 14 Fév 2012 - 20:48

Salutation,

J'ai choisi un theme que j'aime bien sur hitskin et je crois que la feuille de style csss à été modifier et ça affecte la barre de navigation. L'orsque je met la barre en image, elle est toute décoller et de plus, il y a une bande de couleur qui ne me plait pas. Je ne sais pas comment arranger ça. Voici un screen pour mieux comprendre;

Barre de Navigation Sans_t12

Que dois-je faire pour y remedier, s.v.p ?


Dernière édition par La Luna le Mer 15 Fév 2012 - 0:29, édité 1 fois
La Luna

La Luna
****

Féminin
Messages : 349
Inscrit(e) le : 21/02/2006

http://www.forumharrypotter.bbgraph.com
La Luna a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Barre de Navigation

Message par SoraNoHime Mar 14 Fév 2012 - 21:02

Bonsoir

pouvez-vous me fournir votre feuille de style css ?

Cordialement.
SoraNoHime

SoraNoHime
Membre actif

Féminin
Messages : 6218
Inscrit(e) le : 10/06/2010

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

Résolu Re: Barre de Navigation

Message par La Luna Mar 14 Fév 2012 - 21:15

Les voici; Smile

Code:
.bodyline{ -moz-border-radius: 10px;}


textarea, .textarea.post, input.post {
-moz-border-radius:10px;
}

a {
font-variant: small-caps;
}

body {
background-repeat: no-repeat;
}
a { text-decoration: none; }

.bodyline {
-moz-border-radius:6px;
}

.forumline{
background-color: #044457;
-moz-border-radius: 10px ;
border: 2px #044457 solid;
}




.postbody {
background-repeat: repeat;
background-image: url('http://i49.tinypic.com/9vd11l.png');
background-position: center;
}

td.row1 {
background-repeat: repeat;
background-image: url('http://i49.tinypic.com/9vd11l.png');
background-position: center;
}
td.row2 {
background-repeat: repeat;
background-image: url('http://i49.tinypic.com/9vd11l.png');
background-position: center;
}
td.row3 {
background-repeat: repeat;
background-image: url('http://i49.tinypic.com/9vd11l.png');
background-position: center;
}

td.row3Right {
background:url('http://i49.tinypic.com/9vd11l.png');
border-style: none
}

td.row3{
background-image: url("http://i49.tinypic.com/9vd11l.png");
}





a.mainmenu:link, a.mainmenu:visited{
margin-left : 4px;
margin-right : 4px;
font-family :Georgia;
color: #062b36;
background-image: url("http://i49.tinypic.com/258ndky.png");
text-align:left;
border-left: 9px solid #062b36;
border-right: 9px solid: url("http://i45.tinypic.com/ztdoo7.png");
}

a.mainmenu:hover, a.mainmenu:hover:visited{
color: #9a816d;
border-left: 9px solid #9a816d;
border-right: 9px solid: url("http://i48.tinypic.com/5ff15g.png");
}


  div.infobulle {
  position: relative;
  float: left;}

div.infobulle span {
  display: none;}

div.infobulle:hover {
  background: none; /* correction d'un bug IE */
  z-index: 999;}

div.infobulle:hover span {
color: #637F87;
-moz-border-radius: 50px;
text-align: center;
text-shadow: #000000 1px 1px 1px;
width: 210px;
background: #ffffff;
border: 3px solid #96C6D2;
display: inline;
position: absolute;
top: 100px;
left: 50px;
padding: 10px;
-moz-box-shadow: 2px 3px 3px black;}


ul, li{
  list-style: none;}

.mon_onglet{
  padding: 10px ;
  color: #ffffff;
text-shadow: 1px 1px 3px black;
  background: #EED5D2;
-moz-border-radius:  10% 10% 0% 0%;
  cursor: pointer;} 

 
   
.mon_onglet_selected{
 -moz-box-shadow:inset 2px 3px 3px black;
  padding: 10px ;
  color: #3b1f05;
-moz-border-radius: 10% 10% 0% 0% ;
  background: #dddddd;
  cursor: pointer;}           
 

.mon_contenu{
margin-top: -70px;
font-size: 11px;
width: 650px;
height: 220px;
 background: #F0FFF0;
 -moz-box-shadow:inset 2px 3px 3px black;
border: 5px solid #EED5D2 ;
padding: 20px;
  color: #6E6E6E;
-moz-border-radius: 50px;
line-height: 18px;}



.imagepa { border: solid 5px #FFffff;
 -moz-border-radius: 10px;
 margin-left: -5px;}

.imagepa:hover {border: solid 5px #96C6D2;
 -moz-border-radius: 10px;
 margin-left: 10px;
opacity: 0.7;  }

#menu ul li a,
.menu ul li a:visited {display:block;  -moz-border-radius: 10% 10% 10% 10% ;  color: #6E6E6E; width:150px; height:20px; text-align:center; background: #EED5D2;  font-size:12px; padding: 3px;} /* NORMAL */

#menu ul { padding: 10px;  list-style-type: none; }
#menu ul li {float:left; margin-right:1px; position:relative;}
#menu ul li ul {display: none;}

#menu ul li:hover a {background: #Ffffff; color:#  6E6E6E ; } /* MODE ITEM HOVER */

#menu ul li:hover ul {display:block; position:absolute; top:10px;margin-left: -10px; }
#menu ul li:hover ul li a.hide { color:#96C6D2;} /* MODE HOVER */
#menu ul li:hover ul li:hover a.hide {width:110px;}
#menu ul li:hover ul li ul {display: none;}
#menu ul li:hover ul li a {display:block; color:#ffffff; text-shadow: 1px 1px 3px black;} /* MODE SOUS ITEM NORMAL */

#menu ul li:hover ul li a:hover {color:#96C6D2;} /* MODE SOUS ITEM HOVER */

#menu ul li:hover ul li:hover ul {display:block; position:absolute; margin-left: -10px; top:10px; color:#5F828B; background: #Ffffff; } /* MODE HOVER */

#menu ul li:hover ul li:hover ul li a {display:block; color:#5F828B; font-weight : bold;} /* MODE HOVER */

#menu ul li:hover ul li:hover ul li a:hover {color:#5F828B; font-weight : bold;} /* MODE SOUS ITEM HOVER */






.navig {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    width: 100%;
    font-family: arial;
    background-image: url(http://i43.servimg.com/u/f43/12/93/20/40/prez12.jpg);
    border-bottom: 5px solid #5C0623;
a.mainmenu img{
display: none;
}
    }


div.infobulle {
  position: relative;
  float: left;
}

div.infobulle span {
  display: none; /* ceci masque l'infobulle */
}
div.infobulle:hover {
  background: none; /* correction d'un bug IE */
  z-index: 999; /* on dé️finit une valeur pour l'ordre d'affichage */
}
div.infobulle:hover span {
font-style: normal;
display: inline;
position: absolute;
top: 50px;
left: 50px;
background-image: url(http://i43.servimg.com/u/f43/12/93/20/40/prez10.jpg);
color: #555658;
padding-left: 10px;
padding-right: 10px;
padding-bottom: 2px;
padding-top: 2px;
border: 2px dotted #555658;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
text-align: center;
}
a.liens_staff, a.liens_staff:link, a.liens_staff:active, a.liens_staff:visited {
text-decoration: none;
outline: none;
}
a.liens_staff:before {
content: "-";
margin-right: 3px;
}
a.liens_staff:hover {
text-decoration: none !important;
}
a.liens_staff:hover:before {
content: "{";
margin-right: 3px;
}
.blabyuiogfq:before {
content: "}";
}

--------------------------------------------------------------------------------------------------------------





img{
max-width:800px;}


.imgopa {
opacity: 0.5 ;
}

.imgopa:hover {
opacity: 1;
}






.ascenseur {
position: fixed; /*--- Cette ligne permet de toujours afficher l'ascenseur à l'é️cran ---*/
top: 200px; /*--- On le place à XX px du haut de l'é️cran ---*/
left: 0px; /*--- On le place à X px de la gauche de l'é️cran ---*/
background-image: url(http://i43.servimg.com/u/f43/12/93/20/40/prez10.jpg); /*--- On donne une couleur au fond ---*/
border: 3px solid #8ba3ba
}





/* Dé️but - style pour vé️rification pseudo à l'inscription */
#username_reg {
  color: #a90c0c;
}
#username_reg.okusername {
  color: #2f9122;
}
/* Fin - style pour vé️rification pseudo à l'inscription */



/*Dé️but - SÉLECTIONNEUR COULEUR*/
.colorpicker {
  width: 356px;
  height: 176px;
  overflow: hidden;
  position: absolute;
  background: url(http://tinyurl.com/colorpickerimg/colorpicker_background.png);
  font-family: Arial, Helvetica, sans-serif;
  display: none;
}
.colorpicker_color {
  width: 150px;
  height: 150px;
  left: 14px;
  top: 13px;
  position: absolute;
  background: #f00;
  overflow: hidden;
  cursor: crosshair;
}
.colorpicker_color div {
  position: absolute;
  top: 0;
  left: 0;
  width: 150px;
  height: 150px;
  background: url(http://tinyurl.com/colorpickerimg/colorpicker_overlay.png);
}
.colorpicker_color div div {
  position: absolute;
  top: 0;
  left: 0;
  width: 11px;
  height: 11px;
  overflow: hidden;
  background: url(http://tinyurl.com/colorpickerimg/colorpicker_select.gif);
  margin: -5px 0 0 -5px;
}
.colorpicker_hue {
  position: absolute;
  top: 13px;
  left: 171px;
  width: 35px;
  height: 150px;
  cursor: n-resize;
}
.colorpicker_hue div {
  position: absolute;
  width: 35px;
  height: 9px;
  overflow: hidden;
  background: url(http://tinyurl.com/colorpickerimg/colorpicker_indic.gif) left top;
  margin: -4px 0 0 0;
  left: 0px;
}
.colorpicker_new_color {
  position: absolute;
  width: 60px;
  height: 30px;
  left: 213px;
  top: 13px;
  background: #f00;
}
.colorpicker_current_color {
  position: absolute;
  width: 60px;
  height: 30px;
  left: 283px;
  top: 13px;
  background: #f00;
}
.colorpicker input {
  background-color: transparent;
  border: 1px solid transparent;
  position: absolute;
  font-size: 10px;
  font-family: Arial, Helvetica, sans-serif;
  color: #898989;
  top: 4px;
  right: 11px;
  text-align: right;
  margin: 0;
  padding: 0;
  height: 11px;
}
.colorpicker_hex {
  position: absolute;
  width: 72px;
  height: 22px;
  background: url(http://tinyurl.com/colorpickerimg/colorpicker_hex.png) top;
  left: 212px;
  top: 142px;
}
.colorpicker_hex input {
  right: 6px;
}
.colorpicker_field {
  height: 22px;
  width: 62px;
  background-position: top;
  position: absolute;
}
.colorpicker_field span {
  position: absolute;
  width: 12px;
  height: 22px;
  overflow: hidden;
  top: 0;
  right: 0;
  cursor: n-resize;
}
.colorpicker_rgb_r {
  background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_rgb_r.png);
  top: 52px;
  left: 212px;
}
.colorpicker_rgb_g {
  background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_rgb_g.png);
  top: 82px;
  left: 212px;
}
.colorpicker_rgb_b {
  background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_rgb_b.png);
  top: 112px;
  left: 212px;
}
.colorpicker_hsb_h {
  background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_hsb_h.png);
  top: 52px;
  left: 282px;
}
.colorpicker_hsb_s {
  background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_hsb_s.png);
  top: 82px;
  left: 282px;
}
.colorpicker_hsb_b {
  background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_hsb_b.png);
  top: 112px;
  left: 282px;
}
.colorpicker_submit {
  position: absolute;
  width: 22px;
  height: 22px;
  background: url(http://tinyurl.com/colorpickerimg/colorpicker_submit.png) top;
  left: 322px;
  top: 142px;
  overflow: hidden;
}
.colorpicker_focus {
  background-position: center;
}
.colorpicker_hex.colorpicker_focus {
  background-position: bottom;
}
.colorpicker_submit.colorpicker_focus {
  background-position: bottom;
}
.colorpicker_slider {
  background-position: bottom;
}



/*FIN - SÉLECTIONNEUR COULEUR*/







ul, li{
  list-style: none;
}
.mon_onglet{
  float: left;
  padding: 2px 10px;
  margin-right: 5px;
  color: #555658;
  background-image: url(http://hitskin.com/themes/14/94/85/i_back_catd.png);
  border: 1px solid #3d3237;
  cursor: pointer;
 -moz-border-radius-topleft: 20px;
      -moz-border-radius-topright: 20px;
      -webkit-border-top-right-radius: 20px;
      -webkit-border-top-left-radius: 20px;
      border-top-right-radius: 20px;
      border-top-left-radius: 20px;
}

.mon_onglet:hover{
  background-image: url(http://hitskin.com/themes/14/94/85/i_back_catd.png);
-moz-border-radius-topleft: 20px;
      -moz-border-radius-topright: 20px;
      -webkit-border-top-right-radius: 20px;
      -webkit-border-top-left-radius: 20px;
      border-top-right-radius: 20px;
      border-top-left-radius: 20px;}         

.mon_onglet_selected{
  float: left;
  padding: 2px 10px;
  margin-right: 5px;
  color: #555658;
  background-image: url(http://hitskin.com/themes/14/94/85/i_back_catd.png);
  border-top: 1px solid #555658;
  border-right: 1px solid #555658;
  border-left: 1px solid #555658;
  border-bottom: 1px solid #555658;
  cursor: pointer;
  margin-bottom: -1px;
-moz-border-radius-topleft: 20px;
      -moz-border-radius-topright: 20px;
      -webkit-border-top-right-radius: 20px;
      -webkit-border-top-left-radius: 20px;
      border-top-right-radius: 20px;
      border-top-left-radius: 20px;}           
.clear{
  clear: both;
}
.mon_contenu{
  color: #555658;
  background-image: url(http://hitskin.com/themes/14/94/85/i_back_catd.png);
  border: 1px solid #555658;
    -moz-border-radius:10px;
    -webkit-border-radius: 10px;
    border-radius:10px;
  padding: 1px;
        margin-left: -10px;
  height: 250px;         
}
#mes_contenus, #mes_onglets{
  width: 300px;
  height: 250px;
}

.titres{
 background-image: url(http://hitskin.com/themes/14/94/85/i_back_catd.png);
 border: 1px solid #555658;
    -moz-border-radius:10px;
    -webkit-border-radius: 10px;
    border-radius:10px;
text-align:center;
padding:5px;}







.statistiques{
border:0px;
background-image: url("http://img11.hostingpics.net/pics/490365who.png");
background-repeat: no-repeat;
background-position: center;
height:300px;}

.groupes{
background-image: url(http://hitskin.com/themes/14/94/85/i_back_catd.png);
height:10px;
padding-right: 10px;
padding-left: 10px;
padding-bottom: 2px;
moz-box-shadow:1px 1px 5px #262626;-webkit-box-shadow:1px 1px 5px #262626;box-shadow:1px 1px 5px #262626;
font-size: 10px;
font-weight: arial;
text-align: right;
text-decoration: 2;}



.forumline{
background-image: url(http://hitskin.com/themes/14/94/85/i_back_catd.png);
-moz-border-radius: 0px ;
border: 3px double solid;
}
a.forumlink{
-moz-border-radius: 7px 7px 7px 7px;
background-image: url(http://hitskin.com/themes/14/94/85/i_back_catd.png);
border-bottom: 3px double #555658;
color:#555658;
font-family: arial;
font-size: 12px;
font-weight: lighter;
letter-spacing: 4px;
display:block;
text-align: center;
moz-box-shadow:1px 1px 5px #262626;-webkit-box-shadow:1px 1px 5px #262626;box-shadow:1px 1px 5px #262626;
}


-----------------------------------------------------

a
{font-family: arial;
text-transform: none;
text-decoration: none;
text-shadow: 1px 1px 1px #262626;
border-bottom: none;}

a:hover
{font-style: none;
font-family: arial;
text-transform: uppercase;
text-shadow: #ffffff 0px 0px 2px;" class="gradualfader";
letter-spacing: 2px;
font-size: 13px;
text-decoration: none;}


a:hover{text-decoration: none !important;}
a{text-decoration: none !important;}
La Luna

La Luna
****

Féminin
Messages : 349
Inscrit(e) le : 21/02/2006

http://www.forumharrypotter.bbgraph.com
La Luna a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Barre de Navigation

Message par Dr. Karlos Mar 14 Fév 2012 - 22:43

Bonsoir,

Repérez cette partie dans votre CSS:
Code:
a.mainmenu:link, a.mainmenu:visited{
margin-left : 4px;
margin-right : 4px;
font-family :Georgia;
color: #062b36;
background-image: url("http://i49.tinypic.com/258ndky.png");
text-align:left;
border-left: 9px solid #062b36;
border-right: 9px solid: url("http://i45.tinypic.com/ztdoo7.png");
}

Et changez-la pour celle-ci:
Code:
a.mainmenu:link, a.mainmenu:visited{
margin-left : 4px;
margin-right : 4px;
font-family :Georgia;
color: #062b36;
background-image: url("http://i49.tinypic.com/258ndky.png");
text-align:left;
border-left: 0px solid #062b36;
border-right: 0px solid: url("http://i45.tinypic.com/ztdoo7.png");
}

Il s'agit de la barre de menu en liens. Wink


Cordialement.
Dr. Karlos

Dr. Karlos
Membre actif

Masculin
Messages : 2623
Inscrit(e) le : 03/01/2012

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

Résolu Re: Barre de Navigation

Message par La Luna Mer 15 Fév 2012 - 0:28

Ha Oui, ça fonctionne à merveille, un gros merci !!! cheers
La Luna

La Luna
****

Féminin
Messages : 349
Inscrit(e) le : 21/02/2006

http://www.forumharrypotter.bbgraph.com
La Luna 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