CSSActif, le forum, n'est plus maintenu. Il est néanmoins disponible pour consultation. Pour des outils pratiques, rendez-vous sur:  Découvrez CSSActif, une collection d'outils et de tutoriels interactifs pour les développeurs Web — HTML, CSS, JavaScript et bien plus! |
| | Masquer la feuille de personnage, problème CSS. |  |
|  Aero-L 
{ Membre }
 Messages : 33
 | Bonjour, je cherchais comment masquer la feuille de personnage comme sur de nombreux forums car je trouve ça très pratique, et je suis donc tombée sur ce sujet.
Et voilà ce que j'ai obtenu : - Spoiler:
Malheureusement, je n'arrive pas à modifier le CSS comme je le voudrais.
Je voudrais que le fond 1 n'apparaisse pas, mais que ce soit le bouton (2) qui ait ce fond. De plus, j'aimerais un padding de 2px entre le texte du bouton et la bordure, de même quand le bouton est ouvert.
Voilà la partie de mon template viewtopic_body correspondante : - Code:
-
<!-- BEGIN displayed --> <tr class="post"> <td style="text-align: center;" class="{postrow.displayed.ROW_CLASS}"{postrow.displayed.THANK_BGCOLOR} valign="top" width="150"> <div class="profilentour"> <center><span class="name"><a name="{postrow.displayed.U_POST_ID}"></a><strong>{postrow.displayed.POSTER_NAME}</strong></span></center> <span class="postdetails poster-profile"> {postrow.displayed.POSTER_RANK} <center><span class="rankpic">{postrow.displayed.RANK_IMAGE}</span><span class="posterava">{postrow.displayed.POSTER_AVATAR}</span></center></div><br> <div class="profilmasque" onClick="this.firstChild.value=(this.firstChild.value=='Want more ?')?'Less.':'Want more ?';this.lastChild.style.display=(this.firstChild.value=='Want more ?')?'none':'block';" style="text-align: center;"><input type="button" value="Want more ?" class="profil1"/><div style="display:none; text-align:center;"> <!-- BEGIN profile_field --> <font size=2>{postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR} <!-- END profile_field --> {postrow.displayed.POSTER_RPG} </div></div> </span></font> </div>
Ainsi que mon CSS : - Code:
-
/*Profil masqué + bouton*/
.profilmasque{
background-image: url("http://nsa22.casimages.com/img/2010/09/24/10092410264314753.png");
width: 200px;
border:0px;
-moz-border-radius:15px;
-webkit-border-radius: 15px;
border-radius:15px;
font-size: 12px;
padding: 3px;
}
.profil1/*Bouton*/
{
padding:2px;
}
Je peux également donner le lien de mon forum si besoin est (:
Merci d'avance à celui où celle qui saura m'aider (: |
Dernière édition par Aero-L le Mar 04 Jan 2011, 13:28, édité 1 fois | |
| | | | Haribot' ♪
{ Membre hyper-actif }
 Messages : 5163
| Essaye de remplacer ton CSS par ceci : - Code:
-
/*Profil masqué + bouton*/
.profilmasque{
width: 200px;
border:0px;
-moz-border-radius:15px;
-webkit-border-radius: 15px;
border-radius:15px;
font-size: 12px;
padding: 3px;
}
.profil1/*Bouton*/
{
padding:2px;
background-image: url("http://nsa22.casimages.com/img/2010/09/24/10092410264314753.png");
} | | |
| | | | Aero-L
{ Membre }
Messages : 33
| Merci beaucoup, j'ai obtenu le fond du bouton comme je le voulais, mais j'aimerais que quand on ouvre, le fond rouge englobe tout comme sur la deuxième image. Voilà ce que j'obtiens : - Spoiler:
(: | | |
| | | | Orange 
RocketMan
Messages : 3086
| Bonjour, Ton problème est-il résolu ? Par hasard, et alors là ça serait vraiment un beau hasard, ceci marcherait peut-être: - Code:
-
<!-- BEGIN displayed --> <tr class="post"> <td style="text-align: center;" class="{postrow.displayed.ROW_CLASS}"{postrow.displayed.THANK_BGCOLOR} valign="top" width="150"> <div class="profilentour"> <center><span class="name"><a name="{postrow.displayed.U_POST_ID}"></a><strong>{postrow.displayed.POSTER_NAME}</strong></span></center> <span class="postdetails poster-profile"> {postrow.displayed.POSTER_RANK}<br /> <center><span class="rankpic">{postrow.displayed.RANK_IMAGE}</span><span class="posterava">{postrow.displayed.POSTER_AVATAR}</span></center></div><br> <div class="profilmasque" onClick="this.firstChild.value=(this.firstChild.value=='Want more ?')?'Less.':'Want more ?';this.lastChild.style.display=(this.firstChild.value=='Want more ?')?'none':'block'; this.style.backgroundImage='url(http://nsa22.casimages.com/img/2010/09/24/10092410264314753.png)';" style="text-align: center;"><input type="button" value="Want more ?" class="profil1"/><div style="display:none; text-align:center;"> <!-- BEGIN profile_field --> <font size=2>{postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR} <!-- END profile_field --> {postrow.displayed.POSTER_RPG} </div></div> </span></font><br /> </div> | | |
| | | | Aero-L
{ Membre }
Messages : 33
| En fait c'est assez bizarre. Effectivement, le fond de couleur n'y est pas avant de cliquer puis lors du clic apparait comme je le souhaite, mais ensuite il reste (:
Merci pour ton aide Orange, tu peux classe le problème, je vais garder la solution proposée par Hari qui finalement, me plait bien (: Merci quand même (: | | |
| | | | Psycho 
Psychopathe
Messages : 3407
| | | | | Contenu sponsorisé
| | | | | | | Masquer la feuille de personnage, problème CSS. | |
|
Sujets similaires | |
|
| | Permission de ce forum: | Vous ne pouvez pas répondre aux sujets dans ce forum
| |
| |
| |
|
| Partenaires Or
|
|
