Personnaliser cadre "description du message"

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

Résolu Personnaliser cadre "description du message"

Message par Matthieu A. le Mer 20 Mar 2013 - 18:27

bonjour,

j'ai créé sur mon forum un cadre autour de la "description du message", comme ce forum.

J'ai fabriqué ce code CSS:
Code:

.author {
background-color:#FFFFFF;
  margin: 8px;
-webkit-border-radius:20px;
-moz-border-radius:20px;
  khtml-border-radius: 20px;
border-radius:15px;}

mais j'ai quelques problèmes à le personnaliser:

- j'aimerais que la longueur du cadre s'adapte à la longueur de ce qui est écrit
- j'aimerais créer un espace en titre ce cadre et le titre du message

voici la représentation:


version phpbb3

cc

Matthieu A.
****

Masculin
Messages : 258
Inscrit(e) le : 11/03/2013

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

Résolu Re: Personnaliser cadre "description du message"

Message par Matriochka le Jeu 21 Mar 2013 - 6:33

Bonjour,

Tu peux ajouter ceci à l’élément author : width:300px (par exemple, mais tu peux modifier la valeur au besoin)

Et pour ajouter une marge entre le titre et le nom de l’auteur, utilise margin-top:20px; (par exemple), toujours sur l’élément author.

Ce qui, au final, nous donnerait quelque chose comme ceci :
Code:
.author {
background-color:#FFFFFF;
-webkit-border-radius:20px;
-moz-border-radius:20px;
khtml-border-radius: 20px;
border-radius:15px;
width:300px;
margin-top:20px;}

Matriochka
+ Hyperactif +

Messages : 7604
Inscrit(e) le : 14/07/2010

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

Résolu Re: Personnaliser cadre "description du message"

Message par Matthieu A. le Jeu 21 Mar 2013 - 15:17

bonjour et merci à toi pour ta réponse
- le code pour la longueur fonctionne parfaitement
- le code margin-top:20px n'a aucune influence sur l'espace entre le titre et l'auteur

comment faire ?

cc

Matthieu A.
****

Masculin
Messages : 258
Inscrit(e) le : 11/03/2013

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

Résolu Re: Personnaliser cadre "description du message"

Message par Matriochka le Jeu 21 Mar 2013 - 15:24

Et en remplaçant margin-top:20px; par margin-top:20px:important; ?

Matriochka
+ Hyperactif +

Messages : 7604
Inscrit(e) le : 14/07/2010

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

Résolu Re: Personnaliser cadre "description du message"

Message par Matthieu A. le Jeu 21 Mar 2013 - 15:33

ce code aussi (margin-top:20px:important;), n'a aucun effet

cc

Matthieu A.
****

Masculin
Messages : 258
Inscrit(e) le : 11/03/2013

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

Résolu Re: Personnaliser cadre "description du message"

Message par Matthieu A. le Ven 22 Mar 2013 - 17:55

up

Matthieu A.
****

Masculin
Messages : 258
Inscrit(e) le : 11/03/2013

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

Résolu Re: Personnaliser cadre "description du message"

Message par Matthieu A. le Dim 24 Mar 2013 - 11:13

up

Matthieu A.
****

Masculin
Messages : 258
Inscrit(e) le : 11/03/2013

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

Résolu Re: Personnaliser cadre "description du message"

Message par Matriochka le Dim 24 Mar 2013 - 11:31

Navrée pour le temps de réponse.

Remplace le code donné plus haut par :
Code:
p.author {
background-color:#FFFFFF;
-webkit-border-radius:20px;
-moz-border-radius:20px;
khtml-border-radius: 20px;
border-radius:15px;
width:300px;
margin-top:20px;}

Matriochka
+ Hyperactif +

Messages : 7604
Inscrit(e) le : 14/07/2010

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

Résolu Re: Personnaliser cadre "description du message"

Message par Matthieu A. le Dim 24 Mar 2013 - 11:43

merci à toi, c'est parfait sujet résolu

comme tu es très compétente en CSS , tu pourrais peut êre m'aider sur ce sujet: http://forum.forumactif.com/t347952-mettre-en-ligne-dans-le-cadre-du-mini-profil-du-message

merci encore

Matthieu A.
****

Masculin
Messages : 258
Inscrit(e) le : 11/03/2013

Matthieu A. 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