2 Problèmes types CSS

[Fokkusu]

Bonjour,

Je vais essayer d'être brève et explicite afin de vous exposer rapidement mes problèmes :

1er Problème : Je souhaiterais que mes catégories ne soit pas sur ce fond beige, mais sur un fond transparent qui laisserait apparaître le fond du forum.

2ème Problème : Comme faire pour que les liens, les spoiler et le texte des catégories de mon forum soit ombré en utilisant ce code?

Code:

<span style="text-shadow:2px 2px 4px black">TEXTE</span>

Pourriez-vous me donner les codes à insérer ou à enlever de ma feuille CSS pour que les critères précédents apparaissent dorénavant sur mon forum?

PS : Voici ce qu'il est inscrit dans ma Feuille CSS :

Code:

a.mainmenu{
   font-size: 11px;
   color: #14695b;
   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: #53837b;
   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 #53837b;}

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://s2.noelshack.com/old/up/antiinvite-3363ca7489.png");
   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;}

PS 2 : Pour mon deuxième problème, je souhaiterais que cela ressemble à ce forum (juste l'idée, les spoilers ombrés en plus)

Merci d'avance

[Horatio]

Bonsoir,

Placez ces codes dans votre css et dites moi ce que vous observez, étant donnez que je ne suis pas sur.

Code:

/*Titre des catégories*/
        .secondarytitle{
        background-color: transparent;
}
        .secondarytitle h2 {
        background-color: transparent;
}


Code:

 .forumlink {
        background-color: transparent;
}

  a.forumlink {
    background-color: transparent;
}


Cordialement

[Invité]

Bonjour,

Pour ce qui est de votre 2ème question, essayez éventuellement de remplacer votre CSS par celui-ci :

Code:

    a.mainmenu{
      font-size: 11px;
      color: #14695b;
      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: #53837b;
      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 #53837b;}

    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;}

a:link {text-shadow:2px 2px 4px black}
a:visited {text-shadow:2px 2px 4px black}
a:hover {text-shadow:2px 2px 4px black}
a:active {text-shadow:2px 2px 4px black}


    body{
      cursor:crosshair;}

    .forumline {
      -moz-border-radius:30px;
      -webkit-border-radius:30px;
      -moz-box-shadow: 5px 5px 7px #787878;
      background-image:url("http://s2.noelshack.com/old/up/antiinvite-3363ca7489.png");
      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;
text-shadow:2px 2px 4px black;
            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;
text-shadow:2px 2px 4px black;
      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;}

Si le résultat ne correspond pas à ce que vous vouliez, remettez votre CSS de départ.

Par ailleurs, pourrions-nous avoir un lien vers votre forum pour constater de visu votre 1er problème ?

Cordialement

[Fokkusu]

Merci Horatio, mais cela ne marche pas :S

Lydie1 : Merci, vous avez résolu mon 2ème problème
Voici le lien de mon forum : ...
Je parle du fond beige à motifs qui sépare mes catégories...
Je vous ai fait 2 schémas pour vous expliquer le plus précisément possible mon problème :

Schéma 1 :


Le 1 correspondant au fond à motifs beige que je souhaite enlever et le 2 correspondant au fond beige identique au 1 mais que je souhaiterais toutefois remplacer par ce fond :

Je souhaiterais donc que cela donne comme sur le schéma ci-dessous :



Le 1 correspondant maintenant au fond à motifs beige inexistant donc correspondant à un fond transparent qui laisserait paraître le fond du forum. Le 2 correspondant maintenant au fond beige à motifs remplacé par le fond gris à motifs que j'ai spécifié ci-dessus.

En espérant avoir été la plus claire possible

[Invité]

Rebonjour,

Je ne suis pas certaine d'avoir exactement tout compris. J'ai tenté quelque chose. Essayez de mettre ce code dans votre feuille de style CSS en remplacement de l'ancien :

Code:

  a.mainmenu{
          font-size: 11px;
          color: #14695b;
          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: #53837b;
          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 #53837b;}

        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;}

    a:link {text-shadow:2px 2px 4px black}
    a:visited {text-shadow:2px 2px 4px black}
    a:hover {text-shadow:2px 2px 4px black}
    a:active {text-shadow:2px 2px 4px black}


        body{
          cursor:crosshair;}

        .forumline {
          -moz-border-radius:30px;
          -webkit-border-radius:30px;
          -moz-box-shadow: 5px 5px 7px #787878;
          background-image:url("http://s2.noelshack.com/old/up/antiinvite-3363ca7489.png");
          padding:10px;}

        td.row3,td.row1,td.row2,td.row3Right {
          background-image:url("http://i42.servimg.com/u/f42/16/62/32/16/i_back10.png");}

        .bodyline{
     
          -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;
    text-shadow:2px 2px 4px black;
                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;
    text-shadow:2px 2px 4px black;
          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;}

Toujours pareil, si le résultat ne vous convient pas supprimez-le.

Cordialement

[Fokkusu]

C'est parfait, merci beaucoup

Bonne journée!