Dissocier la partie

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

Résolu Dissocier la partie

Message par Nightkiss le Mar 25 Mai 2010 - 12:12

Bonjour,

je cherche à modifier l'apparence des messages de mon forum en plaçant un bandeau ou un filet sous la partie qui inclue "titre, nom de l'auteur du message, heure du message).

Ou mieux, serait-il possible de donner une couleur différente à cette partie, pour qu'elle se dissocie du corps du message ?

Merci d'avance de votre aide Smile


Dernière édition par Nightkiss le Mer 26 Mai 2010 - 19:20, édité 1 fois

Nightkiss
Nouveau membre

Messages : 15
Inscrit(e) le : 01/04/2009

http://metacoalition.forumactif.com
Nightkiss a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Dissocier la partie

Message par Ea le Mar 25 Mai 2010 - 12:42

Bonjour,


Pour mettre une autre couleur de fond derrière on pourrait ajouter dans le CSS ( PA > Affichage > Couleurs > Feuille de style CSS ) :

Code:
.postbody p.author{ background: red; border-left: 2px solid green; border-bottom:2px solid green;}
.postbody h2.topic-title { background: red; border-left: 2px solid green;}
Mais c'est pas top, je trouve que mettre des bords comme ceci donne meilleur effet :

Code:
.postbody p.author{ border-left: 1px solid #180700; border-bottom:1px solid #180700;-moz-border-radius-bottomleft: 10px; -webkit-border-bottom-left-radius: 10px; border-bottom-left-radius: 10px; }
.postbody h2.topic-title { border-left: 1px solid #180700; }
Là je met juste un bord gauche aux titres, un bord gauche et bas au " nom de l'auteur et heure du message " avec un arrondi qui devrait fonctionner pour google chrome ( safari, chromium, ... ), firefox ( et tout les navigateurs construit à partir de firefox ) et opera.

Cordialement.

Ea
Aidactif
Aidactif

Messages : 23442
Inscrit(e) le : 04/04/2008

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

Résolu Re: Dissocier la partie

Message par Nightkiss le Mar 25 Mai 2010 - 14:00

J'ai opté pour la 1ère solution. Par contre, j'aimerai que la couleur de fond ne soit pas limitée au texte, mais aille jusqu'au bout de mon cadre de message.

Je cherche sur le net, mais j'avoue que le code CSS et moi, ça fait 2 (minimum Wink ).

Ceci dit, merci déjà beaucoup pour ce début de réponse Smile

P.S.: en plus, j'avais positionné mes boutons "citer, éditer, etc..." en haut des messages et je trouve plutôt comment les positionner en bas... avec la nouvelle couleur, ça se chevauche et ça fait tout moche Wink

Nightkiss
Nouveau membre

Messages : 15
Inscrit(e) le : 01/04/2009

http://metacoalition.forumactif.com
Nightkiss a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Dissocier la partie

Message par Nightkiss le Mer 26 Mai 2010 - 9:47

Avec de l'aide, je suis finalement arrivé à ce code :

Code:
.postbody p.author{-moz-border-radius-bottomleft: 10px;-webkit-border-bottom-left-radius: 10px;-moz-border-radius-bottomright: 10px;-webkit-border-bottom-right-radius: 10px;border-bottom-left-radius: 10px;background: #5E5E5E}

.postbody h2.topic-title {-moz-border-radius-topleft: 10px;-webkit-border-top-left-radius: 10px;-moz-border-radius-topright: 10px;-webkit-border-top-right-radius: 10px;background: #5E5E5E}
Ça commence à ressembler à ce que je recherche, mais je voudrai appliquer la couleur de fond des sections titre et auteur à toute la ligne.

Si quelqu'un avait une idée...

Merci d'avance Smile

Nightkiss
Nouveau membre

Messages : 15
Inscrit(e) le : 01/04/2009

http://metacoalition.forumactif.com
Nightkiss a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Dissocier la partie

Message par Nightkiss le Mer 26 Mai 2010 - 16:22

Le soucis de largeur du backgroun a finalement été résolu avec ce code :

Code:
.postbody p.author{-moz-border-radius-bottomleft: 10px;-webkit-border-bottom-left-radius: 10px;-moz-border-radius-bottomright: 10px;-webkit-border-bottom-right-radius: 10px;border-bottom-left-radius: 10px;background: #5E5E5E; -moz-border-radius-topleft: 10px;-webkit-border-top-left-radius: 10px;-moz-border-radius-topright: 10px;-webkit-border-top-right-radius: 10px;width:100%}
Mais il ne s'applique qu'aux informations d'auteur... pas moyen de l'appliquer au titre.

Et je n'ai pas non plus trouvé de solution pour déplacer les boutons "citer, supprimer, éditer, etc...) pour qu'ils ne chevauchent pas ce nouveau bandeau... dur dur Very Happy

Nightkiss
Nouveau membre

Messages : 15
Inscrit(e) le : 01/04/2009

http://metacoalition.forumactif.com
Nightkiss a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Dissocier la partie

Message par Nightkiss le Mer 26 Mai 2010 - 19:18

Voici la version final du code, qui correspond exactement à ce que je cherchais à faire :
Code:
.postbody p.author{-moz-border-radius-bottomleft: 10px;-webkit-border-bottom-left-radius: 10px;-moz-border-radius-bottomright: 10px;-webkit-border-bottom-right-radius: 10px;border-bottom-left-radius: 10px;background: #5E5E5E; width:100%}

.postbody h2.topic-title {display : block; -moz-border-radius-topleft: 10px;-webkit-border-top-left-radius: 10px;-moz-border-radius-topright: 10px;-webkit-border-top-right-radius: 10px;background: #5E5E5E; width:100%;margin-bottom : 0px !important}

Merci encore de m'avoir mis sur la voie Etana. Ça m'a permis d'aboutir au résultat final avec l'aide précieuse aussi d'un membre de mon forum Smile

Nightkiss
Nouveau membre

Messages : 15
Inscrit(e) le : 01/04/2009

http://metacoalition.forumactif.com
Nightkiss a été remercié(e) par l'auteur de ce sujet.

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


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