| Contour autour de l'avatar (messages) | |
|
|
Tech
{ Membre actif }
Messages : 1378
| Merci pour le tuto ^^ Je le valide. | | |
|
| |
Invité Invité
| Super ce tuto ! Joli effet | | |
|
| |
kalyon
{ Membre }
Messages : 156
| Ce code fonctionne toujours ? Car personnellement je l'avait avant, et je ne l'est plus, enfin il ne s'affiche plus ! je pensais avoir fait une mauvaise manipulation, mais en re-essayant, ça ne fonctionne toujours pas >< Pourtant il n'y a rien de bien sorcier dans ce CSS :X Amicalement | | |
|
| |
Tech
{ Membre actif }
Messages : 1378
| Bonjour,
Je viens de le tester à l'instant, et oui il fonctionne toujours. Le problème doit venir de chez toi. Tu es sur que le code CSS est bien fait ? Tu as peut-être modifié un template ? | | |
|
| |
kalyon
{ Membre }
Messages : 156
| oui, j'ai 4 template modifier ... Mais a mon grand regret, j'utilise un sélécteur de thème :X Le soucis vien peut-etre de la ? je dois peut-etre l'ajouter au css de mon sélécteur ? Amicalement | | |
|
| |
Tech
{ Membre actif }
Messages : 1378
| Oui peut-être. Essaye et tu verras | | |
|
| |
Invité Invité
| oh génial, merci beaucoup ! j'suis carrément fan de celui ci | | |
|
| |
Thryna
{ Membre }
Messages : 84
| |
| |
Invité Invité
| Merci je cherchais comment faire :0 bien expliquer en plus. | | |
|
| |
Kofee ♥
{ Membre }
Messages : 5
| Merci !! ^^ Ca fait un joli effet | | |
|
| |
Angie*
{ Membre }
Messages : 19
| merci beaucoup c'est super | | |
|
| |
Roy Ascalon
{ Membre }
Messages : 11
| Merci beaucoup pour ce paramétrage mais je voulais savoir si il était possible de l'appliquer à une image d'une infobulle ? Si oui, comment ? | | |
|
| |
Invité Invité
| Si tu veux dire mettre un fond de couleur derrière l'image dans ton infobulle oui c'est possible : Dans ton infobulle tu as l'adresse de ton image comme ceci : - Code:
-
<img src="URL DE L'IMAGE"> On est bien d'accord ? Il te suffit de rajouter dans cette balise la valeur : - Code:
-
style="TES PROPRIETES CSS" Par exemple : - Code:
-
<img src="URL DE L'IMAGE" style="background-color: black; padding: 10px;"> Important : Il faut mettre un padding si tu veux que la couleur apparaisse, sans padding le fond de couleur se trouve en réalité sous l'image donc on ne peut pas le voir =) | | |
|
| |
Roy Ascalon
{ Membre }
Messages : 11
| Bah en fait j'essaie d'appliquer l'encadrement d'une infobulle comme sur ce forum.
http://chinoyou.forums-actifs.com/
On voit bien que le staff, en tout cas l'image représentative des membres du staff est encadrée selon ce procédé. Tout du moins, je le pense. | | |
|
| |
Invité Invité
| J'ai mis ce code sur un forum test il a marché je l'ai essayé sur mn forum, il m'a viré le contour arrondi du forum et il ne s'est pas affiché. | | |
|
| |
Invité Invité
| - Roy Ascalon a écrit:
Bah en fait j'essaie d'appliquer l'encadrement d'une infobulle comme sur ce forum.
http://chinoyou.forums-actifs.com/
On voit bien que le staff, en tout cas l'image représentative des membres du staff est encadrée selon ce procédé. Tout du moins, je le pense. Ah mais si tu parles de l'image qu'on voit sur la PA et pas celle qui est dans l'infobulle ça n'a rien à voir avec l'infobulle à proprement parler x) Dans ce cas là c'est pas dans le de l'infobulle qui faut mettre les propriétés de style mais dans le 1er . Par contre sur leur forum c'est fait graphiquement et non pas avec un code | | |
|
| |
U L I X E S ♪
{ Membre }
Messages : 280
| - Alice@ a écrit:
- J'ai mis ce code sur un forum test il a marché je l'ai essayé sur mn forum, il m'a viré le contour arrondi du forum et il ne s'est pas affiché.
Sur le forum où le code a marché, est-ce qu'il y avait le code pour le contour du forum ? | | |
|
| |
Invité Invité
| Il n'y avait aucun codes.... | | |
|
| |
U L I X E S ♪
{ Membre }
Messages : 280
| Avais-tu pris le code pour le contour du forum sur CSSActif ou sur un autre forum ? | | |
|
| |
Invité Invité
| J'en sais rien du tout, car je ne suis pas la seule admin à faire du CSS, grand bien fasse au forum d'ailleurs. Je copie colle la feuille de style - Spoiler:
/*Barre de navigation*/ a.mainmenu{ background-color: #BDBDBF; text-align: center; text-color: #1EAFE3; padding-top: 5px; padding-bottom: 5px; text-transform:none; -moz-border-radius: 10px; -webkit-border-radius: 10px; }
a.mainmenu:hover{ background-color: #CFCFD1;}
.mainmenu img {display: none;}
/* SUPPRIMER ÉDITION */ tr.post span.gensmall { display: none; }
/*LIENS PA*/ .main {background-color: #BDBDBF; border-right: 5px solid #951A1D; border-left: 5px solid #951A1D; width: 110px; text-align: center; text-color: #1EAFE3; padding-top: 5px; padding-bottom: 5px;}
.main:hover {border-right: 5px solid #808080; border-left: 5px solid #808080;}
/*HEADER*/ body { background-attachment: scroll; background-repeat: no-repeat; background-position: top center; }
/*LIENS*/ a { font-variant: small-caps; text-decoration: none; }
/*TEXTE JUSTIFIE BLOCKQUOTE*/ .postbody { display: block; padding-left: 25px; padding-right: 25px; text-align:justify; }
/*PATTERN HAHA CECILE FAIT DU CSS XD*/ td.row1{ background-color: #; background-image: url(http://obsession27.free.fr/divers/fonds/gr3.jpg); background-repeat: repeat; } td.row2{ background-color: #; background-image: url(http://obsession27.free.fr/divers/fonds/gr3.jpg); background-repeat: repeat; } td.row3{ background-color: #; background-image: url(http://obsession27.free.fr/divers/fonds/gr3.jpg); background-repeat: repeat; }
td.row3Right { background:url(http://obsession27.free.fr/divers/fonds/gr3.jpg); border-style: none }
/*CONTOUR FORUM*/ .forumline{ background-color: #BF3859; -moz-border-radius: 10px ; border: 1px #941938 solid; }
/*LIENS CATEGORIE*/ a.forumlink{ -moz-border-radius: 7px 7px 7px 7px; border-bottom: 5px double #941938; padding-lefft:20px; font-weight:bold; font-size:11px; display:block; text-align: center; text-transform:uppercase; background-image: url(http://obsession27.free.fr/divers/fonds/gr3.jpg); }
a.forumlink:hover{ -moz-border-radius: 7px 7px 7px 7px; border-bottom: 5px double #941938; padding-leftt:45px; font-weight:bold; color:#3D3C3C; font-size:11px; display:block; text-align:center; text-transform:uppercase; background-image: url(http://obsession27.free.fr/divers/fonds/gr3.jpg); }
/*LIENS*/ a {text-decoration: none;} a:link {text-decoration: none;} a:hover {text-decoration: none!important;} a.forumlink {text-decoration: none;} a.forumlink:hover {text-decoration: none!important;} a.topiclink {text-decoration: none; } a.topiclink:hover {text-decoration: none!important; }
/*QEEL*/ .body { display: block; text-align: justify; }
/*CONTOUR AVATAR*/ .postdetails.poster-profile a img { -moz-border-radius-bottomleft:10px; -moz-border-radius-bottomright:10px; -moz-border-radius-topleft:10px; -moz-border-radius-topright:10px; border: 5px solid #7C0324; }
| | |
|
| |
Invité Invité
| Coucou, Il y avait quelques erreurs dans ton CSS alors je te les ai corrigé =) - Code:
-
/*Barre de navigation*/ a.mainmenu{ background-color: #BDBDBF; text-align: center; color: #1EAFE3; padding-top: 5px; padding-bottom: 5px; text-transform:none; -moz-border-radius: 10px; -webkit-border-radius: 10px; }
a.mainmenu:hover{ background-color: #CFCFD1; }
.mainmenu img { display: none; }
/* SUPPRIMER ÉDITION */ tr.post span.gensmall { display: none; }
/*LIENS PA*/ .main { background-color: #BDBDBF; border-right: 5px solid #951A1D; border-left: 5px solid #951A1D; width: 110px; text-align: center; color: #1EAFE3; padding-top: 5px; padding-bottom: 5px; }
.main:hover { border-right: 5px solid #808080; border-left: 5px solid #808080; }
/*HEADER*/ body { background-attachment: scroll; background-repeat: no-repeat; background-position: top center; }
/*LIENS*/ a { font-variant: small-caps; text-decoration: none; }
/*TEXTE JUSTIFIE BLOCKQUOTE*/ .postbody { display: block; padding-left: 25px; padding-right: 25px; text-align:justify; }
/*PATTERN HAHA CECILE FAIT DU CSS XD*/ td.row1{ background-image: url(http://obsession27.free.fr/divers/fonds/gr3.jpg); background-repeat: repeat; } td.row2{ background-image: url(http://obsession27.free.fr/divers/fonds/gr3.jpg); background-repeat: repeat; } td.row3{ background-image: url(http://obsession27.free.fr/divers/fonds/gr3.jpg); background-repeat: repeat; }
td.row3Right { background:url(http://obsession27.free.fr/divers/fonds/gr3.jpg); border-style: none; }
/*CONTOUR FORUM*/ .forumline{ background-color: #BF3859; -moz-border-radius: 10px; -webkit-border-radius: 10px; border: 1px #941938 solid; }
/*LIENS CATEGORIE*/ a.forumlink{ -moz-border-radius: 7px 7px 7px 7px; -webkit-border-radius: 7px 7px 7px 7px; border-bottom: 5px double #941938; padding-left:20px; font-weight:bold; font-size:11px; display:block; text-align: center; text-transform:uppercase; background-image: url(http://obsession27.free.fr/divers/fonds/gr3.jpg); }
a.forumlink:hover{ -moz-border-radius: 7px 7px 7px 7px; -webkit-border-radius: 7px 7px 7px 7px; border-bottom: 5px double #941938; padding-left:45px; font-weight:bold; color:#3D3C3C; font-size:11px; display:block; text-align:center; text-transform:uppercase; background-image: url(http://obsession27.free.fr/divers/fonds/gr3.jpg); }
/*LIENS*/ a {text-decoration: none;} a:link {text-decoration: none;} a:hover {text-decoration: none!important;} a.forumlink {text-decoration: none;} a.forumlink:hover {text-decoration: none!important;} a.topiclink {text-decoration: none; } a.topiclink:hover {text-decoration: none!important; }
/*QEEL*/ .body { display: block; text-align: justify; }
/*CONTOUR AVATAR*/ .postdetails.poster-profile a img { -moz-border-radius-bottomleft: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; border: 5px solid #7C0324; } | | |
|
| |
Invité Invité
| - Kimy a écrit:
- Coucou,
Il y avait quelques erreurs dans ton CSS alors je te les ai corrigé =)
- Code:
-
/*Barre de navigation*/ a.mainmenu{ background-color: #BDBDBF; text-align: center; color: #1EAFE3; padding-top: 5px; padding-bottom: 5px; text-transform:none; -moz-border-radius: 10px; -webkit-border-radius: 10px; }
a.mainmenu:hover{ background-color: #CFCFD1; }
.mainmenu img { display: none; }
/* SUPPRIMER ÉDITION */ tr.post span.gensmall { display: none; }
/*LIENS PA*/ .main { background-color: #BDBDBF; border-right: 5px solid #951A1D; border-left: 5px solid #951A1D; width: 110px; text-align: center; color: #1EAFE3; padding-top: 5px; padding-bottom: 5px; }
.main:hover { border-right: 5px solid #808080; border-left: 5px solid #808080; }
/*HEADER*/ body { background-attachment: scroll; background-repeat: no-repeat; background-position: top center; }
/*LIENS*/ a { font-variant: small-caps; text-decoration: none; }
/*TEXTE JUSTIFIE BLOCKQUOTE*/ .postbody { display: block; padding-left: 25px; padding-right: 25px; text-align:justify; }
/*PATTERN HAHA CECILE FAIT DU CSS XD*/ td.row1{ background-image: url(http://obsession27.free.fr/divers/fonds/gr3.jpg); background-repeat: repeat; } td.row2{ background-image: url(http://obsession27.free.fr/divers/fonds/gr3.jpg); background-repeat: repeat; } td.row3{ background-image: url(http://obsession27.free.fr/divers/fonds/gr3.jpg); background-repeat: repeat; }
td.row3Right { background:url(http://obsession27.free.fr/divers/fonds/gr3.jpg); border-style: none; }
/*CONTOUR FORUM*/ .forumline{ background-color: #BF3859; -moz-border-radius: 10px; -webkit-border-radius: 10px; border: 1px #941938 solid; }
/*LIENS CATEGORIE*/ a.forumlink{ -moz-border-radius: 7px 7px 7px 7px; -webkit-border-radius: 7px 7px 7px 7px; border-bottom: 5px double #941938; padding-left:20px; font-weight:bold; font-size:11px; display:block; text-align: center; text-transform:uppercase; background-image: url(http://obsession27.free.fr/divers/fonds/gr3.jpg); }
a.forumlink:hover{ -moz-border-radius: 7px 7px 7px 7px; -webkit-border-radius: 7px 7px 7px 7px; border-bottom: 5px double #941938; padding-left:45px; font-weight:bold; color:#3D3C3C; font-size:11px; display:block; text-align:center; text-transform:uppercase; background-image: url(http://obsession27.free.fr/divers/fonds/gr3.jpg); }
/*LIENS*/ a {text-decoration: none;} a:link {text-decoration: none;} a:hover {text-decoration: none!important;} a.forumlink {text-decoration: none;} a.forumlink:hover {text-decoration: none!important;} a.topiclink {text-decoration: none; } a.topiclink:hover {text-decoration: none!important; }
/*QEEL*/ .body { display: block; text-align: justify; }
/*CONTOUR AVATAR*/ .postdetails.poster-profile a img { -moz-border-radius-bottomleft: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; border: 5px solid #7C0324; } Sinon chez moi il s'affiche très bien. Donc réessaye avec ce code et si ça ne marche pas c'est peut-être un problème au niveau des templates ? Je ne sais pas :/ Mais si le code marche chez moi ça ne peut pas venir de lui | | |
|
| |
U L I X E S ♪
{ Membre }
Messages : 280
| J'ai visité son forum et j'ai vu le problème. En fait, elle a modifié l'une des tempales pour faire en sorte à ce que l'avatar soit en haut du pseudo ect. Donc c'est pour cela que ça ne marche pas. | | |
|
| |
Roy Ascalon
{ Membre }
Messages : 11
| - Kimy a écrit:
- Roy Ascalon a écrit:
Bah en fait j'essaie d'appliquer l'encadrement d'une infobulle comme sur ce forum.
http://chinoyou.forums-actifs.com/
On voit bien que le staff, en tout cas l'image représentative des membres du staff est encadrée selon ce procédé. Tout du moins, je le pense. Ah mais si tu parles de l'image qu'on voit sur la PA et pas celle qui est dans l'infobulle ça n'a rien à voir avec l'infobulle à proprement parler x) Dans ce cas là c'est pas dans le de l'infobulle qui faut mettre les propriétés de style mais dans le 1er .
Par contre sur leur forum c'est fait graphiquement et non pas avec un code - Code:
-
a.infobulle { position: relative; }
a.infobulle span { display: none; /* ceci masque l'infobulle */ } a.infobulle:hover { background: none; /* correction d'un bug IE */ z-index: 500; /* on définit une valeur pour l'ordre d'affichage */
} a.infobulle:hover span { display: inline; /* ceci affiche l'infobulle */ position: absolute;
white-space: nowrap; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */
top: 5px; /* on positionne notre infobulle */ left: 15px;
background: #ebebeb; /* arrière-plan de l'infobulle */
color: black; /* texte dans l'infobulle */ padding: 3px;
/* bordures de votre infobulle*/ border: 1px dotted black; border-left: 1px dotted black; } Alors où dois-je modifier la paramétrisation dans ce CSS pour obtenir un encadrement d'une image ? | | |
|
| |
Invité Invité
| Non tu n'as pas compris ce que je voulais dire TwT Je peux avoir ton code HTML de ton infobulle s'il te plaît ? | | |
|
| |
Contenu sponsorisé
| |
| |
| Contour autour de l'avatar (messages) | |
|