Changer l'apparence de la citation sans le pseudo...

[Clemsi]

Rappel du premier message :

Détails techniques

Version du forum : Invision
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://meseries.forumactif.com/

Description du problème

Bonsoir,

J'aimerais savoir si c'est possible de changer l'apparence de la citation sans le pseudo.
Je veux qu'elle soit comme celle avec le pseudo précisé (citation deux petits points ou quelque chose d'autre).
Parce que là, c'est juste un rectangle, et j'aime pas.

Regardez :
http://meseries.forumactif.com/t168p250-saison-3-d-outlander

[Clemsi]

J'ai juste à remplacer les codes blockquote et blockquote cite par les tiens, Jay ?
Ou je dois juste rajouter certaines lignes de tes codes ?

[◦Jay◦]

Normalement, vous devez avoir :

Code:

blockquote {
    -moz-border-radius-topleft: 15px;
    -webkit-border-radius-topleft: 15px;
    background-color: #191919;
    background-image: url(http://i65.servimg.com/u/f65/11/95/30/70/fond12.jpg);
    border: 1px solid #888;
    color: #fff;
    padding: 5px;
}

à remplacer par :

Code:

blockquote {
  border-radius:10px 0 0 0;
  background-image: url(https://i62.servimg.com/u/f62/18/95/70/55/barre-11.png),url(http://i65.servimg.com/u/f65/11/95/30/70/fond12.jpg);
  background-repeat:no-repeat,repeat;
  border: 1px solid #888;
  color: #fff;
  background-position: 5px 4px ;
  padding:40px 5px 5px 5px;
 
}

Et :

Code:

blockquote cite {
    -moz-border-radius: 12px;
    -webkit-border-radius: 12px;
    background-color: #707070;
    background-image: url(http://i65.servimg.com/u/f65/11/95/30/70/citati11.png);
    background-position: top right;
    background-repeat: no-repeat;
    border: 1px solid #888;
    color: #000;
    font-weight: 700;
}

à remplacer par :

Code:

blockquote cite {
  background-image: url(http://i65.servimg.com/u/f65/11/95/30/70/citati11.png);
    background-position: top right;
    background-repeat: no-repeat;
    border: 1px solid #888;
    color: #000;
    font-weight: 700;
  border-radius:12px;
  background-color: #707070;
  margin-top:-35px;
  margin-left:2px;
  width:652px;
}

[Clemsi]

Oui, ça marche !

Sauf que quand il y a des citations dans des citations, ça déborde :
http://meseries.forumactif.com/t416p20-elijah-et-hayley

[◦Jay◦]

Vous pouvez ajouter ceci mais ça altère légèrement la qualité de l'image "citation" :

Code:

blockquote blockquote{background-size:99%;}
blockquote blockquote cite{width:99%;
}

[Clemsi]

Ouais, ça altère la qualité, c'est dommage...

Sinon, c'est possible d'avoir la même chose pour le code, Jay ?
http://meseries.forumactif.com/t2-modele-de-presentation

[◦Jay◦]

Supprimez :

Code:

.codebox dd {
    -moz-border-radius-bottomleft: 0;
    -moz-border-radius-bottomright: 0;
    -moz-border-radius-topleft: 15px;
    -moz-border-radius-topright: 15px;
    -webkit-border-radius-bottomleft: 0;
    -webkit-border-radius-bottomright: 0;
    -webkit-border-radius-topleft: 15px;
    -webkit-border-radius-topright: 15px;
    background-color: #191919;
    background-image: url(http://i65.servimg.com/u/f65/11/95/30/70/fond12.jpg);
    border: 1px solid #888;
    color: #fff;
    padding: 5px;
}

Et :

Code:

.codebox dt {
    -moz-border-radius: 12px;
    -webkit-border-radius: 12px;
    background-color: #707070;
    background-image: url(http://i65.servimg.com/u/f65/11/95/30/70/citati10.png);
    background-position: top right;
    background-repeat: no-repeat;
    border: 1px solid #888;
    color: #000;
    font-weight: 700;
    padding: 5px 10px 3px 3px;
}

Et mettez :

Code:

.codebox dd {
    background-color:transparent;
    border:none
}
.codebox.contcode{
    border-radius: 10px 0 0 0;
    background-image: url(http://i65.servimg.com/u/f65/11/95/30/70/fond12.jpg);
    background-repeat:repeat;
    border: 1px solid #888;
    color: #fff;
    background-position: 5px 4px;
    padding: 0px 0px 5px 5px;
}

.codebox dt{
    border-radius: 12px;
    background-color: #707070;
    background-image: url(http://i65.servimg.com/u/f65/11/95/30/70/citati10.png);
    background-position: top right;
    background-repeat: no-repeat;
    width:650px;
    border: 1px solid #888;
    color: #000;
    font-weight: 700;
    padding: 5px 10px 3px 3px;
    margin-top:8px;}

[Clemsi]

Merci beaucoup, Jay !
C'est Parfait !
Enfin presque, c'est dommage pour les citations dans les citations qui débordent.
Dommage qu'il n'existe pas de codes pouvant résoudre le problème sans altérer la qualité de la citation.

Pour les spoiler, c'est possible d'avoir quelque chose de smilaire, aussi, stp ?
http://meseries.forumactif.com/t164-game-of-thrones-en-general
Je ne sais pas pourquoi, mais la barre blanche laisse un espace noir dans le cadre à gauche, et il y a des contours noirs sauf à gauche aussi...
Et le contenu est centré, c'est bizarre.
Je dois ouvrir un autre topic ?

[◦Jay◦]

En gardant la barre blanche qui est grise :


Remplacez :

Code:

.spoiler {
    background-color: #222;
    border-bottom: 1px dotted #000;
    border-left: 5px solid #222;
    border-right: 1px dotted #000;
    border-top: 1px dotted #000;
    display: block;
    margin: 8px;
    padding: 8px;
}

Par :

Code:

dl.spoiler{
  background-image: url(http://i65.servimg.com/u/f65/11/95/30/70/fond12.jpg);
  background-repeat:repeat;
  border:1px solid #888;
  margin: 8px;
  padding: 8px;
}

[Clemsi]

Je trouve pas mon code spoiler actuel dans mon css, il est à quel ligne ?

[◦Jay◦]

Bah dans la case "Rechercher dans le CSS" écrivez spoiler puis cliquez sur "rechercher"

[Clemsi]

Non, ça ne fait rien quand je clique sur rechercher.
Tu es sûr que j'ai un code spoiler dans le css ?

[◦Jay◦]

Il doit être dans le css de base alors il faut juste mettre le code que je vous ai donné :

Code:

dl.spoiler{
  background-image: url(http://i65.servimg.com/u/f65/11/95/30/70/fond12.jpg);
  background-repeat:repeat;
  border:1px solid #888;
  margin: 8px;
  padding: 8px;
}

[Clemsi]

J'enlève le code actuel dans le css de base ou je le laisse ?

[◦Jay◦]

Non, ne vous occupez pas du css de base.

[Clemsi]

Merci, c'est parfait, Jay !
Je mets le sujet en résolu.
Mais si un jour tu trouves un code pour résoudre le problème des citations dans les citations sans altérer la qualité, tu peux m'envoyer un message privé, stp ?

[◦Jay◦]

J'y songerai.

Bonne soirée.

[◦Jay◦]

Attendez, enlevez le "résolu", je fais un test.

[Clemsi]

Voilà, j'ai enlevé le résolu.

[◦Jay◦]

Alors voila, ça résout le problème, la barre est plus petite mais ça permet de citer plusieurs fois, il me semble que visuellement, c'est ce qu'il y aura de mieux :

Code:

blockquote blockquote {
    background-image: url(https://i62.servimg.com/u/f62/18/95/70/55/bbquot10.png),url(http://i65.servimg.com/u/f65/11/95/30/70/fond12.jpg);
    background-position: 5px 4px;
    background-repeat: no-repeat,repeat;}
blockquote cite{width:99%;}

[Clemsi]

Oui, ça régle le problème d'une citation sans le pseudo précisé dans une citation avec le pseudo précisé.

Par contre, une citation avec le pseudo précisé dans une citation avec le pseudo précisé, c'est un autre problème :

[◦Jay◦]

Je me suis trompé dans le code précédent, il ne faut pas mettre :

Code:

blockquote cite{width:99%;}

Mais :

Code:

blockquote blockquote cite{width:99%;}

[Clemsi]

Oui, ça marche !
Du coup, il faut ajouter un code smilaire pour le code, aussi ?
Si quelqu'un cite une citation avec un code par exemple, je ne sais pas.

[◦Jay◦]

Oui, faites un test et mettez-moi le lien que j'y regarde. Je m'absente une demi heure, je regarderai après.

[Clemsi]

Oui, il y a le même problème.^^

[◦Jay◦]

Il faudrait laisser le message que je puisse regarder.

[Clemsi]

Voilà, je l'ai remis :
http://meseries.forumactif.com/t2-modele-de-presentation#2082

[◦Jay◦]

Ajoutez ceci :

Code:

blockquote .codebox dt {width:97%;}

[Clemsi]

C'est bon, tout est nickel.

Merci beaucoup Jay, ça fait plaisir.
Je mets le sujet en résolu.

[◦Jay◦]

Avec plaisir.

@Bientôt.