quote, code, spoiler

[kahlanou]

Salutations !

Je viens vous voir car je n'arrive pas à personnaliser mes quote/code/spoiler !
En effet, récemment mon code a bug (avec le passage de l'editeur) et je n'arrive plus à personnaliser mes quote quoi que j'essaye !!

J'utilise un code trouvé sur ce forum :

Code:

       /* Citations et codes persos */
        .quote {
        border-style: dashed; /* bords en pointillés, mais tu peux l'enlever */
        border-color: #0E0214; /* couleur des bords */
        background: #010F24; /* couleur du fond */
        -moz-border-radius: 10px; /* j'aime bien les bords ronds mais tu peux enlever */
        padding: 3px; /* pour que le texte ne déborde pas des bords ronds, ça rajoute 3px autour du texte  */
        }
        .quote:hover {
        background:
#061919; /* couleur du fond */
        }
        
       .code {border-style: dashed;
        border-color: #01241f;
        background: #010F24;
        -moz-border-radius: 10px;
        padding: 3px;
        }

et impossible que ça soit pris en compte...
D'où pourrait venir le problème ? Cordialement.

[kahlanou]

Petit up ! Merci à vous !   

[Scoubifitz]

Bonjour,

Votre code fonctionne parfaitement ...
Mais quand on met du "presque noir" sur un fond noir on ne peut pas voir la différence ...

je vous remets le code , en poussant un peu les couleurs pour qu'on puisse voir la différence :

Code:

/* Citations et codes persos */
.quote {
border-style: dashed; /* bords en pointillés, mais tu peux l'enlever */
border-color: #cc0214; /* couleur des bords */
background: #010Fcc; /* couleur du fond */
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px; /* j'aime bien les bords ronds mais tu peux enlever */
padding: 3px; /* pour que le texte ne déborde pas des bords ronds, ça rajoute 3px autour du texte  */
}
.quote:hover {
background:#06cc19; /* couleur du fond */
}

.code {border-style: dashed;
border-color: #cc241f;
background: #010Fcc;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
padding: 3px;
}

[kahlanou]

Merci, j'ai vu pour les couleurs de fond et de hover, il n'y a pas de soucis, le soucis est dans le "dashed".. la propriété ne se prend pas en compte, en plus de sa couleur. Et c'est vrai que, bon, loin d'être contraignant, embête un petit peu ^^

[Scoubifitz]

ben , vous avez mis le style de la bordure et la couleur , mais il manque l'épaisseur , non ?

mettez le tout en un :

Code:

border-width: 1px; /* couleur des bords */
border-style: dashed; /* bords en pointillés, mais tu peux l'enlever */
border-color: #cc0214; /* couleur des bords */

deviendrait :

Code:

border: 1px dashed #cc0214;

[kahlanou]

Code:

        /* Citations et codes persos */
        .quote {
          border: 1px dashed #ffffff;
        background: #010F24; /* couleur du fond */
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
        border-radius: 10px; /* j'aime bien les bords ronds mais tu peux enlever */
        padding: 3px; /* pour que le texte ne déborde pas des bords ronds, ça rajoute 3px autour du texte  */
        }

Il n'y a pas de cadre autour ...   

[Scoubifitz]

testez avec dd.quote au lieu de .quote

[kahlanou]

testez avec dd.quote au lieu de .quote

Superbe !   
Seulement je vais poser la question nulle qui se répète.. comment fait-on pour que, comme forumactif; on ait une image à côté du pseudo de la personne ?

(image) Scoubifitz a écrit :

[Ea]

Bonjour,


Sur ce forum, il y a la déclaration CSS :

Code:

background: #FBFBFB url(http://i42.servimg.com/u/f42/09/02/12/09/commen10.png) no-repeat scroll 4px 9px;

si vous cherchez la signification ( en cherchant sur google "css background" par exemple ), c'est qu'il y a un fond en image non répété ( l'image https://i.servimg.com/u/f42/09/02/12/09/commen10.png ) à 4 pixels du bord gauche et 9 pixels du bord haut, et que là où l'image ne couvre pas la couleur est #FBFBFB.

Cordialement.

[kahlanou]

Merci à vous deux (pour les explications claires et précises.)

Ce topic est donc résolu grâce à vous !
Bonne fêtes à tous !