| cadre à côté du forum | |
|
|
Auteur | Message |
---|
Light
Nombre de messages : 224 Age : 27 Localisation : quelque part dans un monde sans fin Logiciel de Création : The Gimp et un peu photoshop Date d'inscription : 18/06/2010
| Sujet: cadre à côté du forum Lun 30 Juil 2012, 17:09 | |
| BONJOUR \o/ J'aurai besoin de votre aide parce qu'en fait sur mon forum j'ai des top-partenaires et je les ai mis dans un cadre sur le côté du forum. L'ennui, c'est qu'il cache les messages >< C'est pour ça, je voudrais savoir s'il n'y a pas un moyen de les mettre sur le fond du forum? Voilà un petit schéma : - Spoiler:
J'espère que vous comprendrez et que vous pourrez m'aider ^^ GRACIAS en tout cas ^^ \o/ | |
|
| |
Ella'
Nombre de messages : 4063 Age : 31 Logiciel de Création : Suite Adobe, Sketch, Suite Affinity Date d'inscription : 19/02/2008
| Sujet: Re: cadre à côté du forum Mer 01 Aoû 2012, 09:53 | |
| Huum, à priori c'est en fonction de la taille d'écran du membre que le cadre est dessus le texte ou non.
As tu essayé de le mettre plus vers le coté et de le faire coulisser au passage de la souris ?
Ou de baisser son opacité pour que même si le cadre chevauche le contenu du forum, on puisse quand même lire ce qu'il y a dessous ? | |
|
| |
Light
Nombre de messages : 224 Age : 27 Localisation : quelque part dans un monde sans fin Logiciel de Création : The Gimp et un peu photoshop Date d'inscription : 18/06/2010
| Sujet: Re: cadre à côté du forum Jeu 02 Aoû 2012, 08:06 | |
| Et bien comme je suis absolument nulle en code, et bien je n'ai touché à rien mais c'est vrai que les faire coulissants ce serait bien ^^ | |
|
| |
Ella'
Nombre de messages : 4063 Age : 31 Logiciel de Création : Suite Adobe, Sketch, Suite Affinity Date d'inscription : 19/02/2008
| Sujet: Re: cadre à côté du forum Ven 03 Aoû 2012, 10:34 | |
| Ok cool alors ! Bon, le code pour mettre les partenaires sur le côté a été ajouté à partir d'un template non ? Si c'est le cas je pourrais avoir le code du cadre ? Je te ferais modifier le CSS par la suite pour que le cadre coulisse au passage de la souris. | |
|
| |
Light
Nombre de messages : 224 Age : 27 Localisation : quelque part dans un monde sans fin Logiciel de Création : The Gimp et un peu photoshop Date d'inscription : 18/06/2010
| Sujet: Re: cadre à côté du forum Ven 03 Aoû 2012, 13:18 | |
| Pas de problème ^^ Voilà donc le template - Code:
-
<!-- BEGIN html_validation --> <div> <div> <table> <tbody> <tr> <td> <!-- END html_validation --> </td> <td valign="top" width="{C3SIZE}"> <div id="{ID_RIGHT}"> <!-- BEGIN giefmod_index2 --> {giefmod_index2.MODVAR} <!-- BEGIN saut --> <div style="height: {SPACE_ROW}px"></div> <!-- END saut --> <!-- END giefmod_index2 --> </div> </td> </tr> <div style="position: absolute; top: 800px; right: 10px; "><span class="boxtoproundtitle">Tops-Partenaires</span> <div style="width: 200px; text-align: center;" class="boxmenu"><a href="http://www.mysteryorphanage.com/">www.</a>Mystery Orphanage<br><a href="http://welcome-to-inazuma.forumactif.com/">www.</a>Sekai No Chousen</br><a href="http://newday-thelastchance.forum-canada.com">www.</a>New Day<br><a href="http://under-graph.forumactif.fr/">www.</a>Under Graph</br> </div></div>
<div style="position: absolute; top: 180px; right: 0px; "><span class="boxtoproundtitle">Votez pour le forum</span> <div style="width: 200px; text-align: center;" class="boxmenu"><a href="http://www.root-top.com/topsite/korben/in.php?ID=12469">♠</a>....<a href="http://www.root-top.com/topsite/moonlighttoprpg/in.php?ID=2778">♠</a>.....<a href="http://www.root-top.com/topsite/blackycalimera/in.php?ID=3094">♠</a>.... <a href="http://www.root-top.com/topsite/abysses/in.php?ID=6174">♠</a>....<a href="http://www.root-top.com/topsite/titop/in.php?ID=1629">♠</a>....<a href="http://www.root-top.com/topsite/forumrpg/in.php?ID=6961">♠</a></div></div> </tbody> </table> </div> </div> <!-- close div id="page-body" --> <div id="page-footer"> <div align="center"> <div class="gen"> <!-- BEGIN html_validation --> </div> </div> </div> <!-- END html_validation --> | |
|
| |
Ella'
Nombre de messages : 4063 Age : 31 Logiciel de Création : Suite Adobe, Sketch, Suite Affinity Date d'inscription : 19/02/2008
| |
| |
Light
Nombre de messages : 224 Age : 27 Localisation : quelque part dans un monde sans fin Logiciel de Création : The Gimp et un peu photoshop Date d'inscription : 18/06/2010
| Sujet: Re: cadre à côté du forum Ven 03 Aoû 2012, 18:12 | |
| Merci beaucoup beaucoup beaucoup >< T'es vraiment géniale Ella" =u= *fait un gros calin qui étouffe Ella"* | |
|
| |
Ella'
Nombre de messages : 4063 Age : 31 Logiciel de Création : Suite Adobe, Sketch, Suite Affinity Date d'inscription : 19/02/2008
| Sujet: Re: cadre à côté du forum Lun 06 Aoû 2012, 17:05 | |
| Bon, je n'ai pas ton CSS donc je n'ai pas le même rendu visuel que toi sur mon forum de test, mais ça coulisse ;)
Déjà je te conseille de ne pas mettre tes div entre un tr et un tbody, mieux vaut le sortir directement du tableau, surtout que les boites sont en position absolute. Bref, mieux vaut que tu le mettes avant ou après la table.
Ensuite donc voilà ton code un chouilla corrigé ( surtout au niveau des ‹br› que tu ouvres et que tu fermes, or le saut de ligne est une balise unique qui s'ouvre et qui se ferme en même temps avec ‹br /› ) et ré-indenté pour une meilleure visualisation du contenu.
- Code:
-
<div class="boxcoulissante" style="position: absolute; top: 800px; "> <span class="boxtoproundtitle">Tops-Partenaires</span> <div style="width: 200px; text-align: center;" class="boxmenu"> <a href="http://www.mysteryorphanage.com/">www.</a>Mystery Orphanage <br /><a href="http://welcome-to-inazuma.forumactif.com/">www.</a>Sekai No Chousen <br /><a href="http://newday-thelastchance.forum-canada.com">www.</a>New Day <br /><a href="http://under-graph.forumactif.fr/">www.</a>Under Graph <br /> </div> </div>
<div class="boxcoulissante" style="position: absolute; top: 180px; "> <span class="boxtoproundtitle">Votez pour le forum</span> <div style="width: 200px; text-align: center;" class="boxmenu"> <a href="http://www.root-top.com/topsite/korben/in.php?ID=12469">♠</a>.... <a href="http://www.root-top.com/topsite/moonlighttoprpg/in.php?ID=2778">♠</a>..... <a href="http://www.root-top.com/topsite/blackycalimera/in.php?ID=3094">♠</a>.... <a href="http://www.root-top.com/topsite/abysses/in.php?ID=6174">♠</a>.... <a href="http://www.root-top.com/topsite/titop/in.php?ID=1629">♠</a>.... <a href="http://www.root-top.com/topsite/forumrpg/in.php?ID=6961">♠</a> </div> </div> Et tu places ce qui correspond à .boxcoulissante :
- Code:
-
.boxcoulissante{ right:-150px; -webkit-transition:right 0.4s ease-in-out; -o-transition:right 0.4s ease-in-out; -moz-transition:right 0.4s ease-in-out; transition:right 0.4s ease-in-out;
}
.boxcoulissante:hover{ right:0px; -webkit-transition:right 0.4s ease-in-out; -o-transition:right 0.4s ease-in-out; -moz-transition:right 0.4s ease-in-out; transition:right 0.4s ease-in-out;
} Je te laisse modifier le right:-150px; en fonction de ce que tu veux Pour t'expliquer, tout est joué avec le :hover, on change juste son affichage par rapport au bord droit
Tiens moi au courant si ça marche | |
|
| |
Light
Nombre de messages : 224 Age : 27 Localisation : quelque part dans un monde sans fin Logiciel de Création : The Gimp et un peu photoshop Date d'inscription : 18/06/2010
| Sujet: Re: cadre à côté du forum Lun 06 Aoû 2012, 19:19 | |
| Et bien il y a un petit problème >< Si je ne passe pas ma souris dessus, les cadres se mettent sur le forum à gauche (là où il y a les profils -_-) et si je passe ma souris dessus, il apparait à droite en "résultat final " si tu veux ^^ Tiens, je te passe mon CSS si ça peut t'aider ;) - Code:
-
/*------------------ Fiche de présentation ------------------*/
/*--- Fond de la présentation ---*/
.fondpres { background-color : #000000; /* Couleur de fond */ border-radius:70px 70px 10px 10px; /* Arrondis des bordures */ width:600px; /* Largeur */ color: #FFFFFF; /* Couleur du texte */ border:10px solid #520000; /* Bordure : taille et couleur */ }
/*--- Les cadres ---*/
.cadrepres { background-color : #520000; /* Couleur de fond */ color: #FFFFFF; /* Couleur du texte */ border-radius:10px 10px 10px 10px; /* Arrondis des bordures */ width:320px; /* Largeur */ height:240px; /* Hauteur */ }
.cadrepres2 { background-color : #520000; /* Couleur de fond */ color: #FFFFFF; /* Couleur du texte */ border-radius:10px 10px 10px 10px; /* Arrondis des bordures */ width:520px; /* Largeur */ height:240px; /* Hauteur */ }
.cadrepres3 { background-color : #520000; /* Couleur de fond */ color: #FFFFFF; /* Couleur du texte */ border-radius:10px 10px 10px 10px; /* Arrondis des bordures */ width:420px; /* Largeur */ height:240px; /* Hauteur */ margin-left : 20px; /* Marge à gauche */ }
/*--- Les titres ---*/
.titrepres { font-size: 30pt; /* Taille de la police */ text-shadow: 0px 5px 10px #000000; /* Ombre sur le texte */ font-family: palace script mt; /* Police */ letter-spacing: 4px; /* Lettres espacées */ margin-bottom: 10px; /* Marge en bas */ margin-top: 10px; /* Marge en haut */ color: #FFFFFF; /* Couleur du texte */ }
/*--- Nom du personnage ---*/
.nomperso{ font-size: 25pt; /* Taille de la police */ text-shadow: 0px 5px 10px #000000; /* Ombre sur le texte */ font-family: script mt bold; /* Police */ letter-spacing: 4px; /* Lettres espacées */ margin-bottom: 10px; /* Marge en bas */ margin-top: 10px; /* Marge en haut */ color: #FFFFFF; /* Couleur du texte */ }
/*--- Scrollbars ---*/
.overflow1 { width:300px; /* Largeur */ height:200px; /* Hauteur */ overflow:auto; text-align: justify; /* Alignement du texte */ }
.overflow2 { width:500px; /* Largeur */ height:200px; /* Hauteur */ overflow:auto; text-align: justify; /* Alignement du texte */ }
.overflow3 { width:400px; /* Largeur */ height:200px; /* Hauteur */ overflow:auto; text-align: justify; /* Alignement du texte */ }
/* ================= ===== Message d'accueil ===== script by James1920 de CSSACTIF - Novembre 13, 2010. MAJ Avril 20, 2012 http://www.themes-fa.com - BY-NC (http://creativecommons.org/licenses/by-nc/2.0/fr/)
================= */
/*----------------- Ma général ----------------- */
/* Pour les défilement */ #scroller_container { padding-top: 15px; overflow: hidden; } /* CSS Hack Safari */ #dummy { ;# } #scroller_container { overflow: auto; }
/*le tableau invisible */
.table25 { border: none ; }
/* Liens */
.a2 { display: block; width: 130px; color: black; text-align:center; border: 1px solid black; -moz-border-radius: 5px; height: 30px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; }
.a2:hover {
background-color: black; color: white; }
#table22 /* fond du ma */ { width: 770px; background-color: #090D08; -moz-border-radius: 15px; -webkit-border-radius: 15px; -khtml-border-radius: 15px; border-radius: 15px; }
/*-----------------Titre----------------- */
/* Le titre special pour le texte de bienvenu */
.h2_themebienvenu { font-size: 14px; background-color: #4A4646; padding: 6px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; color: white; text-align: center; margin: 10px; /max-width: 367px; }
/* le titre special pour les credits */
.h2_themecredit { font-size: 14px; background-color: #4A4646; padding: 6px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; color: white; text-align: center; margin: 10px; /max-width: 160px; }
/* le titre pour les autres boites */
.h2_theme { font-size: 14px; background-color: #4A4646; padding: 6px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; color: white; text-align: center; margin: 10px;
}
/* effet de transparance FF */
.transparence { background-color: transparent; border: none; opacity: 0.5; }
.transparence:hover{ background-color: transparent; border: none; opacity: 2; }
/*-----------------Les boites contenant les textes----------------- */
/* Navigation */
.navi_ma { background-color:#5C5C5C; -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; color: black; font-size: 16px; height: 300px; margin: 10px; width: 130px; padding: 5px; line-height:34px; -webkit-box-shadow: 4px 4px 0 #e6e6e6; -moz-box-shadow: 4px 4px 0 #e6e6e6; -khtml-box-shadow: 4px 4px 0 #e6e6e6; padding-top: 20px;
}
/* News */
.news { background-color: #5C5C5C; -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; color: black; font-size: 14px; height: 120px; width: 160px; margin: 10px; overflow-y: auto; overflow-x: visible; padding: 5px; -webkit-box-shadow: 4px 4px 0 #e6e6e6; -moz-box-shadow: 4px 4px 0 #e6e6e6; -khtml-box-shadow: 4px 4px 0 #e6e6e6; }
/* Partenaires */
.partenaire_test { background-color: #5C5C5C; -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; color: black; font-size: 14px; height: 105px; width: 160px; margin: 10px; padding: 5px; -webkit-box-shadow: 4px 4px 0 #e6e6e6; -moz-box-shadow: 4px 4px 0 #e6e6e6; -khtml-box-shadow: 4px 4px 0 #e6e6e6; padding-top: 20px;
}
/* message de bienvenu */
#bienvenu_ma { background-color: #5C5C5C; -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; color: black; font-size: 14px; height: 120px; margin: 10px; overflow-y: auto; overflow-x: visible; padding: 5px; -webkit-box-shadow: 4px 4px 0 #e6e6e6; -moz-box-shadow: 4px 4px 0 #e6e6e6; -khtml-box-shadow: 4px 4px 0 #e6e6e6; width: 370px; } /* membres staffs */
.staff { background-color: #5C5C5C; -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; color: black; font-size: 10px; height: 105px; width: 180px; margin: 10px; padding: 5px; font-size: 14px; -webkit-box-shadow: 4px 4px 0 #e6e6e6; -moz-box-shadow: 4px 4px 0 #e6e6e6; -khtml-box-shadow: 4px 4px 0 #e6e6e6; padding-top: 20px; }
/*crédits */
.credits { background-color: #5C5C5C; -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; color: white; font-size: 14px; height: 105px; width: 160px; margin: 10px; padding: 5px; -webkit-box-shadow: 4px 4px 0 #e6e6e6; -moz-box-shadow: 4px 4px 0 #e6e6e6; -khtml-box-shadow: 4px 4px 0 #e6e6e6; padding-top: 20px;
}
/*-----------------inffobulles----------------- */
div.infobulle { position: relative; float: left; color: black; }
div.infobulle span { display: none; /* ceci masque l'infobulle */ } div.infobulle:hover { background: none; /* correction d'un bug IE */ z-index: 999; /* on définit une valeur pour l'ordre d'affichage */ color: black; }
/* style de l infobulle */
div.infobulle:hover span { display: inline; /* on affiche l'infobulle */ position: absolute; top: 10px; /* on positionne notre infobulle */ background-color: #4A4646; color: black; padding: 3px; -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; 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é */ text-align: center; font-size: 14px; }
___________________________________ .mainmenu{ text-shadow: 1px 1px 1px black; } .postlink{ color: #000000 } body{ background-image: url("IMAGE DE FOND DE FORUM"); } .forumline{ border: 1px #171717 dashed; } .bodyline { width: 80%; -moz-border-radius: 15px; -webkit-border-radius: 15px; /* est utilisé pour les navigateurs Linux et autres que Firefox*/ background-color: #5C411F; background-attachment: fixed; } u{border-bottom: 1px dotted;border-color:#a9b841;text-decoration: none; }
I{border-bottom:none; color:#999999;text-decoration: none; } a:hover { text-decoration: none ; color: black ; border-bottom: 1px dotted #758219; }
.bodylinewidth { width:60%;} body{ display:block; }
a.cattitle{ text-decoration: none; color : #000000; text-shadow: 1px 1px 1px black; } a.cattitle:hover{ text-decoration: none; text-shadow: 1px 1px 1px black; color: #FFFFFF; } .forumlink{ text-align: center; font-weight: bold; font-size: 12px; color : #000000; display: block; } a.forumlink { text-align: center; background-image: url("IMAGE DE CATEGORIE"); border-bottom: 2px #740f0f; border-top: 2px #740f0f; -moz-border-radius: 7px ; -webkit-border-radius: 7px; border-right: 5px solid #740f0f; border-left: 5px solid #740f0f; -moz-border-radius: 7px ; -webkit-border-radius: 7px; color: #000000; display:block; }
a.forumlink:hover { text-align: center; text-decoration: none; color : #ffffff; text-shadow: #FFFFFF 1px 1px 1px; background-color: #740f0f; border-right: 3px solid #740f0f; border-left: 3px solid #740f0f; -moz-border-radius: 7px ; -webkit-border-radius: 7px; border-bottom: 2px solid #740f0f; border-top: 2px solid #740f0f; -webkit-border-radius: 7px; -moz-border-radius: 7px ;
display:block; } a.forumlink:hover:visited{ background-color: #740f0f; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-left: 5px solid #740f0f; -moz-border-radius: 6px ; -webkit-border-radius: 6px; border-right: 5px solid #740f0f; } a.nav{ text-decoration: none; color : #999999; } a.nav:hover{ text-decoration: none; }
a.topictitle:hover{ text-decoration: none; color : #999999; } a.postlink:hover{ text-decoration: none; color : #999999} a.gen:hover,a.genmed:hover,a.gensmall:hover{ color:#999999; text-decoration: none; } a.copyright:hover { color: #dba1c1; text-decoration: none; } a:link { text-decoration: none; }
a:visited { text-decoration: none; }
a:active { text-decoration: none; } a:link {text-decoration: none;} a:hover{text-decoration: none !important;} a { text-decoration: none; } a:link { text-decoration: none; } a:hover { text-decoration: none; } a.gen:hover,a.genmed:hover,a.gensmall:hover { background-color: #d4d4d2; } a:hover{text-transform:uppercase;}
.quote{ font-family: Tahoma; font-size: 12px; color:#999999 ; line-height: 125%; background-color: #999999; border: #cfcdce; border-style: solid; border: 1px #a08491 dotted; border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px;}
.code{ font-family: Courier,Courier New,sans-serif; font-size: 11px; color: #9b6b6b; background-color: #E6E6E6; border: #cfcdce; border-style: solid; border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border: 1px #a08491 dotted;}
a:hover{text-transform:uppercase;}
.bodylinewidth { width:70%}
a {font-variant: small-caps;} .forumline{-moz-border-radius:15px;} .bodyline {-moz-border-radius:40px;}
a.forumline{ background-color: #ffffff; border: 5px #ffffff solid; }
.statistiques { border:0px; background-image: url("image je sais pas quoi"); background-repeat: repeat-x; background-position: center; height:211px; /* HAUTEUR DE VOTRE IMAGE DE FOND, C'EST UNE VARIABLE */ }
.groupes { background-color:#dad0c7; /* FOND DES NOMS DE GROUPES */ border: 1px #D0D0D0 dotted; /* POUR METTRE LE CONTOUR EN POINTILLES */ -moz-border-radius : 5px 5px 5px 5px; /* ARRONDI DES CONTOURS */ height:40px; /* HAUTEUR DES ENCADRES */ padding-right:24px; /* SÉPARATION ENTRE LES GROUPES */ padding-left:24px; padding-bottom:1px; font-size:13px; /*TAILLE ECRITURE */ font-weight: bold; /* STYLE DE L'ECRITURE */ text-align:center; text-decoration: none !important; }
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: 999; /* 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; }
div.infobulle_avatar em { display:none; }
div.infobulle_avatar:hover { background: none; z-index: 999; cursor: hand; position: relative; text-decoration:none; }
div.infobulle_avatar:hover em { font-style: normal; /*écriture de la police*/ font-size: 10px; /*taille de la police*/ color:#000 !important; /*couleur de la police*/ padding: 3px; display: block; position: absolute; -moz-border-radius: 5px; /* bord arrondis*/ -webkit-border-radius: 5px; /* bord arrondis*/ border-radius: 5px ; /* bord arrondis*/ background-color: #FFF; /*couleur de fond de l'infobulle*/ border: 1px solid #000; /*taille et couleur de la bordure de l'infobulle*/ width:150px; /*largeur de l'infobulle*/ top: 100px; /*infobulle à 100px du haut*/ left: 100px; /*infobulle à 100px de la gauche*/ }
.vignettes {-moz-border-radius:7px; -webkit-border-radius:7px; background-color: #ffffff; padding-right:10px; padding-left:10px; padding-bottom: 3px; padding-top:3px;}
.haccordion{ padding: 0; width: 800px; }
.haccordion ul{ margin: 0; padding: 0; list-style: none; overflow: hidden; }
.haccordion li{ margin: 0; padding: 0; display: block; width: 100%; height: 20px; overflow: hidden; float: left; }
#hc1 li{ margin:0 0px 0 0; width: 800px; }
#hc1 li .hpanel{ padding: 0px; background: transparent; }
.haccordion li .hpanel{ width: 20px; height: 20px; }
#hc1 li{width: 118px; height: 124px; } #hc1 li .hpanel{width: 205px; height: 124px; }
.paonglet { display:inline-block; margin-left:20px; margin-right:20px; padding:10px; cursor:pointer; background-color: #8A8A8A; color: #fff; } .paonglet_0 { border-radius: 2px 2px 2px 2px; -moz-border-radius: 2px 2px 2px 2px; -webkit-border-radius: 2px 2px 2px 2px; } .paonglet_1 { color: #9F0000; border-radius: 2px 2px 2px 2px; -moz-border-radius: 2px 2px 2px 2px; -webkit-border-radius: 2px 2px 2px 2px; }
.contenu_paonglet { margin-top:-1px; padding: 2px; display:none; height: 320px; }
/* set millions of background images */ .rbroundbox { background: url(nt.gif) repeat; } .rbtop div { background: url(tl.gif) no-repeat top left; } .rbtop { background: url(tr.gif) no-repeat top right; } .rbbot div { background: url(bl.gif) no-repeat bottom left; } .rbbot { background: url(br.gif) no-repeat bottom right; }
/* height and width stuff, width not really nessisary. */ .rbtop div, .rbtop, .rbbot div, .rbbot { width: 100%; height: 7px; font-size: 1px; } .rbcontent { margin: 0 7px; } .rbroundbox { width: 50%; margin: 1em auto; }
________________________________________
LES PLUS
___________________________________________________
.titre_categorie { background: #COULEUR; /*fond*/ -moz-border-radius-topleft: 50px; /*arrondi angle gauche*/ -moz-border-radius-topright: 50px; /*arrondi angle droit*/ -webkit-border-radius-top-left: 50px; /*arrondi angle gauche*/ -webkit-border-radius-top-right: 50px; /*arrondi angle droit*/ margin-top: 10px; /*ne pas modifier*/ margin-bottom: -10px; /*a modifier selon vos goûts*/ text-align: center; /*alignement du texte*/ height: auto; /*hauteur à modifier selon vos goûts*/ width: 500px; /*largeur à modifier selon vos goûts*/ margin-left: 350px; /*pour déplacer la position des titres des catégories*/ padding-top: 1px !important; /*espace entre la bordure et le texte*/ padding-bottom: 5px !important; /*espace entre la bordure et le texte*/ -moz-text-shadow: 2px 2px 2px #COULEUR; /*ombre sur le texte*/ -webkit-text-shadow: 2px 2px 2px #COULEUR; /*ombre sur le texte*/ text-shadow: 2px 2px 2px #COULEUR; /*ombre sur le texte*/ }
___________________________________________________ BORDURE:
.ajout_haut { background-color: transparent; background-image: url('http://nsa10.casimages.com/img/2010/01/14/100114065535545189.png') center top no-repeat; width: LARGEUR DE VOTRE IMAGE DU HAUTpx; height: HAUTEUR DE VOTRE IMAGE DU HAUTpx; border: none; }
.ajout_bas { background-color: transparent; background-image: url('http://nsa11.casimages.com/img/2010/01/14/100114065612568113.png') center top no-repeat; width: LARGEUR DE VOTRE IMAGE DU BASpx; height: HAUTEUR DE VOTRE IMAGE DU BASpx; border: none; }
.forumline { background-color: transparent; background-image: url('http://nsa10.casimages.com/img/2010/01/14/100114070515465818.png') center repeat-y; padding: QUELQUESpx; /* Il vaut mieux ajouter quelques pixels de marge intérieure, sinon le forum est collé à l'image intérieure, et ça ne rend pas bien. Faites le test sinon !*/ border: none; }
______________________________________ sous-forums
.vignettes {-moz-border-radius:7px; background-color: #ffffff; padding-right:10px; padding-left:10px; padding-bottom: 3px; padding-top:3px;}
____________________________________________ queel .forumline { -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; border: 4px dotted #7f7757; padding:3px; }
.statistiques { background-color: #473021; overflow:auto; max-height: 200px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; border: 4px dotted #7f7757; padding:10px; margin:10px; text-align:left; }
.groupes { font-size:16px; font-weight:bold; font-style:italic; text-transform:lowercase; text-decoration: none!important; margin-left: 20px; letter-spacing:1px; }
.catqeel { -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; border: 4px dotted #5C411F; padding:20px; background-color:#5C411F; } __________________________________________________
PA /* ***************** CSS DE LA PAGE D'ACCUEIL ******************** by mimizZ | www.graph-forum.com Droit à la modification des couleurs et du fond uniquement ****************************************************************** */
#EnTete { position:relative; /* largeur et hauteur de l'image */ width:800px; height:500px; }
.titre { /* TITRE " BIENVENUE SUR LE FORUM " */ font-family:Helvetica Neue; text-transform:uppercase; letter-spacing:-1px; font-weight:bold; font-size:38px; color:#120C0C; text-shadow: 1px 2px 1px #999999; text-align:center; -webkit-border-radius: 10px; -webkit-border-bottom-right-radius: 40px; -webkit-border-bottom-left-radius: 40px; -moz-border-radius: 10px; -moz-border-radius-bottomright: 40px; -moz-border-radius-bottomleft: 40px; border-radius: 10px; border-bottom-right-radius: 40px; border-bottom-left-radius: 40px; background-color:#292929; border-bottom: 3px solid #414141; padding:5px; }
.presentation { /* CADRE TURQUOISE " PRÉSENTATION " */ margin-right:-4px; margin-left:-10px; background-color:#262626; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; box-shadow: 0px 0px 5px #000; width:430px; height:auto; padding-bottom:8px; padding-left:16px; padding-right:16px; padding-top:50px; }
.presentation p { /* ZONE DE TEXTE PRÉSENTATION */ background-color:#4D4D4D; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; border-bottom: 3px solid #666666; border-left: 3px solid #666666; border-right: 3px solid #666666; color:#999999; font-family:calibri; font-size:13px; text-align:justify; padding:20px; }
.navigation { /* LIENS */ font-family:"Courier New", Courier, monospace; text-transform:uppercase; -webkit-border-top-left-radius: 30px; -webkit-border-bottom-left-radius: 30px; -moz-border-radius-topleft: 30px; -moz-border-radius-bottomleft: 30px; border-top-left-radius: 30px; border-bottom-left-radius: 30px; width:125px; background-color:#171717; font-size:12px; text-align:center; text-shadow:0px 0px 3px #666; margin-left:15px; margin-top:12px; padding: 3px; border-bottom:2px solid #4D4D4D; }
.navigation:hover { background-color:#fff15f; text-shadow:0px 0px 3px #fff; letter-spacing:1px; border-bottom:2px solid #ffd05f; }
.navigation a {color:#FFF} /* COULEUR DES LIENS */ .navigation a:hover {color:#F60} /* COULEUR DES LIENS AU SURVOL */ .annonces { /* ANNONCES QUI DÉFILENT */ width:170px; max-height:185px; -webkit-border-top-right-radius: 30px; -webkit-border-bottom-right-radius: 30px; -moz-border-radius-topright: 30px; -moz-border-radius-bottomright: 30px; border-top-right-radius: 30px; border-bottom-right-radius: 30px; background-color:#171717; padding-top:8px; padding-bottom:8px; padding-right:10px; box-shadow: 1px 0px 4px #4D4D4D; border-left:thin solid #4D4D4D; text-align:center; }
.titre3 { /* TITRE " ANNONCE " */ color:#666666; font-size:19px; font-family:helvetica neue; text-transform:uppercase; letter-spacing:-1px; font-weight:bold; text-align:center; text-shadow: 2px 2px 1px #212121; }
.titre3:hover { color:#d6c8f5; letter-spacing:0px; }
.annonces p { /* ZONE DE TEXTE " ANNONCES */ color:#999999; font-family:calibri; font-size:13px; background-color:#4D4D4D; -webkit-border-top-right-radius: 20px; -webkit-border-bottom-right-radius: 20px; -moz-border-radius-topright: 20px; -moz-border-radius-bottomright: 20px; border-top-right-radius: 20px; border-bottom-right-radius: 20px; text-align:justify; padding:8px; border-right:3px solid #d6c8f5; border-bottom:3px solid #d6c8f5; }
.html-marquee {height:125px;} /* PERMET DE LE DÉFILEMENT DES ANNONCES, NE PAS TOUCHER ! */ .html-marquee2 {height:31px;} /* PERMET DE LE DÉFILEMENT DES PARTENAIRES, NE PAS TOUCHER ! */
.partenaires { /* CADRE DES PARTENAIRES + TITRE */ width:500px; background-color:#212121; box-shadow: 0px 0px 5px #000; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; padding-left:250px; padding-right:10px; padding-top:1px; padding-bottom:1px; background-image: url(http://img444.imageshack.us/img444/3598/partenaires.png); background-repeat:no-repeat; background-position: left center; }
.partenaires p { /* ZONE OÙ LES LOGOS SONT MIS */ background-color:#383838; height:31px; padding:6px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; border-bottom: 3px solid #383838; border-right: 3px solid #383838; border-left: 3px solid #383838; }
.partenaires img { /* OMBRE PORTÉE SUR LES LOGOS DE PARTENARIAT */ box-shadow: 0px 0px 4px #999; } .credits { /* NE PAS ENLEVER ! */ font-family:calibri; font-size:12px; color:#b5b5b5; padding:10px; text-shadow: 0px 0px 4px #000; text-align:center; } .credits a {color:#e2007a;} .credits a:hover {color:#ea69a0;} /* ********************* FIN DU CODE DE LA PA ********************* */
____________________________________________________________________________________ Cadre
____________________________________________________________________
PA
#acordvert { width: 275px; -moz-border-radius : 10px; -webkit-border-radius: 10px; } #info1 { width: 275px; height: 30px; overflow: hidden; background-color:#171717; border-bottom: 1px dotted #000000; transition: 1s; -moz-transition: 1s; -o-transition: 1s; -htm-transition: 1s; -webkit-transition: 1s; -moz-border-radius : 10px; -webkit-border-radius: 10px; } #info3 { width: 275px; height: 30px; overflow: hidden; background-color:#171717; border-bottom: 1px dotted #000000; transition: 1s; -moz-transition: 1s; -o-transition: 1s; -htm-transition: 1s; -webkit-transition: 1s; -moz-border-radius : 10px; -webkit-border-radius: 10px; } #info4 { width: 275px; height: 30px; overflow: hidden; background-color:#171717; border-bottom: 1px dotted #000000; transition: 1s; -moz-transition: 1s; -o-transition: 1s; -htm-transition: 1s; -webkit-transition: 1s; -moz-border-radius : 10px; -webkit-border-radius: 10px; } #info1:hover, #info2:hover, #info3:hover, #info4:hover { height: 150px; overflow: hidden; transition: 1s; -moz-transition: 1s; -o-transition: 1s; -htm-transition: 1s; -webkit-transition: 1s;
} .titre { display: block; text-align: center; width: 275px; height: 36px; font-size: 12px; letter-spacing: 2px; font-family: verdana; font-weight: italic; padding-top: 2px; color:#4D4D4D } .contenu { width: 90%; margin: auto; background-color: #000000; padding: 4px; color: #4D4D4D; font-size: 12px; }
/*---------------- CHATBOX ----------------*/ #chatbox_header .cattitle strong { display: none; }
#chatbox_header .cattitle:before { content: "Faites la Paix pas la Guerre"; }
_____________________________________________
INFOBULLE
/* ------------- FICHE PV Créee par Orange de CSSActif (http://www.css-actif.com) Merci de conserver cette mention par respect ----------- */ .cssactif_pv { /* Fond de la fiche */ background-color: #1D1D1D; /* Couleur de fond */ -webkit-border-radius: 20px; /* Bordures arrondies (voir: http://border-radius.com/) */ -moz-border-radius: 20px;/* Bordures arrondies (voir: http://border-radius.com/) */ border-radius: 20px;/* Bordures arrondies (voir: http://border-radius.com/) */ -webkit-box-shadow: 0px 0px 10px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */ -moz-box-shadow: 0px 0px 10px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */ box-shadow: 0px 0px 10px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */ }
td.cssactif_pv_header { /* En-tête avec image de fond */ background-repeat: no-repeat; /* Empêche la répétition de l'image du header */ background-position: top center; /* Postionne l'image du header en haut, au center */
width: 200px; /* Donne la largeur de la bannière latérale (Largeur de l'avatar) */ height: 320px; /* Donne la hauteur en px du header, l'image de header devrait être même hauteur ou plus grande (Hauteur de l'avatar) */ border-right: 15px double #921628; /* Bordure côté du header: ÉPAISSEURpx STYLE #COULEUR (voir: http://www.css-actif.com/t66-css-cours-elementaire-1-le-groupement#border-style) */ /* Bordures gauche arrondies (voir: http://border-radius.com/) */ -webkit-border-top-left-radius: 20px; -webkit-border-bottom-left-radius: 20px; -moz-border-radius-topleft: 20px; -moz-border-radius-bottomleft: 20px; border-top-left-radius: 20px; border-bottom-left-radius: 20px; text-shadow: 1px 1px 0px #000; /* Ombre du texte */ font-size: 10px; /* Taille du texte: TAILLEpx */ }
div.cssactif_pv_titre h1 { /* Titre prénoms & nom */
font-family: Georgia, "Times New Roman", Times, serif; /*Police du titre (voir: http://www.css-actif.com/t66-css-cours-elementaire-1-le-groupement#forme_caracteres) */
font-size: 32px; /* Taille du texte: TAILLEpx */ text-shadow: 1px 1px 0px #000; /* Ombre du texte */ color: #d51731; /* Couleur du texte */ margin: 0; /* Supprime la marge par défaut de l'élément h1 */ text-align: right; /* Aligne le titre à droite */ text-transform: uppercase; /* Met le titre en majuscules */ }
div.cssactif_pv_titre { /* Titre + feat */ /* Positionne le titre "à cheval" sur la bordure */ position: relative; top: -28px;
text-align: right; /* Aligne le texte à droite */
padding-right: 20px; /* Défifine une marge interne */ color: #CCCCCC; /* Couleur du feat */ }
.cssactif_pv h2 { /* Sous-titres "Identité", "Opinions" etc. */ background-color: #111111; /* Couleur du fond des sous-titres */ border-color: #6a0e1b; /* Couleur de la bordure */ border-width: 1px 0px; /* Taille de la bordure: HAUT & BAS GAUCHE & DROITE */ border-style: solid; /* Style de la bordure */ -webkit-box-shadow: 0px 0px 3px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */ -moz-box-shadow: 0px 0px 3px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */ box-shadow: 0px 0px 3px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */
text-align: center; /* Aligne le titre au centre */ text-transform: uppercase; /* Met le titre en majuscules */ font-family: Georgia, "Times New Roman", Times, serif; /*Police du titre (voir: http://www.css-actif.com/t66-css-cours-elementaire-1-le-groupement#forme_caracteres) */ color: #921628; /* Couleur du titre */ margin: 0; /* Supprimer marge */ font-size: 20px; /* TAILLE DU TEXTE: TAILLEpx */ font-weight: normal; /*Épaisseur du texte */ text-shadow: 1px 1px 0px #000; /*Ombre du texte */ letter-spacing: 5px; /* Espacement des caractères */ }
.cssactif_pv_content { /* Contenu */ padding: 10px; /* Marge interne */ text-align: justify; /* Justifie le texte */ text-shadow: 1px 1px 0px #000; /*Ombre du texte */ }
.cssactif_pv em { /* Libellés */ font-family: Georgia, "Times New Roman", Times, serif; /*Police du titre (voir: http://www.css-actif.com/t66-css-cours-elementaire-1-le-groupement#forme_caracteres) */ color: #921628; /* Couleur du titre */ font-style: normal; text-transform: uppercase; }
div.infobulle { position: relative; cursor:pointer; /*donne au curseur la forme de petite main, comme sur un lien*/ display: inline-block; /*Place les icones un à côté de l'autre */ margin: 10px; /* marge entre les icones */ border: 1px solid #333; /* bordure des icones */ -webkit-box-shadow: 0px 0px 5px 0px #000000; /* Ombre de l'icone (voir http://css3generator.com/ choix "Box-shadow") */ -moz-box-shadow: 0px 0px 5px 0px #000000; /* Ombre de l'icone (voir http://css3generator.com/ choix "Box-shadow") */ box-shadow: 0px 0px 5px 0px #000000; /* Ombre de l'icone (voir http://css3generator.com/ choix "Box-shadow") */
}
div.infobulle img { height: 50px; width: 50px; }
div.infobulle div{ display: none; /* ceci masque l'infobulle */ } div.infobulle:hover { background: none; /* correction d'un bug IE */ z-index: 500; /* on définit une valeur pour l'ordre d'affichage */
} div.infobulle:hover div{ display: block; /* ceci affiche l'infobulle */ position: absolute;
width: 300px; /* Largeur de l'infobulle */
top: 50px; /* on positionne notre infobulle */ left: 0px;
background-color: #1D1D1D; /* Couleur de fond */ -webkit-border-radius: 20px; /* Bordures arrondies (voir: http://border-radius.com/) */ -moz-border-radius: 20px;/* Bordures arrondies (voir: http://border-radius.com/) */ border-radius: 20px;/* Bordures arrondies (voir: http://border-radius.com/) */ -webkit-box-shadow: 0px 0px 10px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */ -moz-box-shadow: 0px 0px 10px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */ box-shadow: 0px 0px 10px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */ border-left: 6px double #921628; padding: 10px; /* marge interne de l'infobulle */ } /* ------------- FIN FICHE PV */
________________________________________________________________
CATEGORIES
.descriptions-categories { background-color:#855230; padding:5px; -moz-border-radius-topleft: 18px; -moz-border-radius-topright: 18px; -moz-border-radius-bottomleft: 18px; -moz-border-radius-bottomright: 18px; border-radius: 18px; -webkit-border-radius: 18px; margin-left:20px; margin-right:2px; margin-bottom: 2px; font-family:Arial; width: 400px; font-size: 11px; line-height: normal; height:60px; overflow:auto; }
.forumlink { font-size:20px; margin-left:15px; font-weight:bolder; word-spacing:2px; text-align:center; display:block; font-family:Georgia; text-shadow: 1px 1px 1px rgb(66, 66, 66); width:80%; }
.forumlastpost { width:95%; background-color:#5C3D28; padding:5px; margin:5px; -moz-border-radius-topleft: 18px; -moz-border-radius-topright: 18px; -moz-border-radius-bottomleft: 18px; -moz-border-radius-bottomright: 18px; border-radius: 18px; -webkit-border-radius: 18px; box-shadow: 0px 3px 3px #ffffff; -moz-box-shadow: 0px 2px 3px #888; -webkit-box-shadow: 0px 2px 3px #888; height:140px; }
.stats-nombre { font-weight: bold; font-family: georgia,serif; padding:4px; margin-bottom:-5px; margin-top:8px; text-align:center; -moz-border-radius-topleft: 18px; -moz-border-radius-topright: 18px; border-radius: 18px; -webkit-border-radius: 18px; float:right; background-color:#473021; border:3px solid #8A6C4B; border-bottom:none; height:14px; width:250px; font-size:12px; }
.stats-forum { font-size:11px; background-color:#473021; padding:5px; -moz-border-radius-topleft: 18px; -moz-border-radius-topright: 18px; -moz-border-radius-bottomleft: 18px; -moz-border-radius-bottomright: 18px; border-radius: 18px; -webkit-border-radius: 18px; text-align:center; margin-right:30px; }
.categories { background-color:#663616; padding:20px; margin:10px; -moz-border-radius-topleft: 30px; -moz-border-radius-topright: 30px; -moz-border-radius-bottomleft: 30px; -moz-border-radius-bottomright: 30px; border-radius: 30px; -webkit-border-radius: 30px; border:3px solid #8A6C4B; }
.noms-categories { font-weight: bold; font-family: georgia,serif; text-shadow: 1px 1px 1px rgb(66, 66, 66); padding:4px; margin-right:20px; margin-top:8px; text-align:center; -moz-border-radius-topleft: 18px; -moz-border-radius-topright: 18px; border-radius: 18px; -webkit-border-radius: 18px; float:right; background-color:#473021; border:3px solid #8A6C4B; border-bottom:none; height:15px; width:250px; }
______________________________________________
gif
.postdetails.poster-profile img { width: 200px; }
.titre { /* Titre non survolé, normal*/ display: block; font-family: ; /* Police du texte */ font-size: ;/* Grosseur du texte soit 100%, 190% étant plus gros */ text-decoration: none; /* Décoration du texte : overline */ text-transform: ; /* Uppercase, capitalize, none, lowecase */ border-bottom: 2px dotted #COULEUR; /* 2px : épaisseur du trait ; dotted : en pointillé */ padding-bottom: 2; text-align: left ;/* Alignement du texte : left, right, center ou justify */ font-size: 16px; color: #COULEUR; /* Couleur du texte */ }
.titre:hover { /* Titre survolé */ color: #COULEUR ; /* Couleur du texte au survol */ text-transform: uppercase; border-bottom: 2px dotted #COULEUR; /* 2px : épaisseur du trait ; dotted : en pointillé */ } _____________________________________________ parto
.boxcoulissante{ right:-150px; -webkit-transition:right 0.4s ease-in-out; -o-transition:right 0.4s ease-in-out; -moz-transition:right 0.4s ease-in-out; transition:right 0.4s ease-in-out;
}
.boxcoulissante:hover{ right:0px; -webkit-transition:right 0.4s ease-in-out; -o-transition:right 0.4s ease-in-out; -moz-transition:right 0.4s ease-in-out; transition:right 0.4s ease-in-out;
}
| |
|
| |
Ella'
Nombre de messages : 4063 Age : 31 Logiciel de Création : Suite Adobe, Sketch, Suite Affinity Date d'inscription : 19/02/2008
| Sujet: Re: cadre à côté du forum Lun 06 Aoû 2012, 19:44 | |
| Alors je ne comprends pas tout là, dans les codes du template, on a des class="boxtoproundtitle" et des class="boxmenu", or rien ne les définie dans ton CSS :S. Il doit y avoir quelque chose qui empêche que ça fonctionne bien, mais d'après ce que je vois, je ne sais pas d'où ça vient, je dois sûrement passer à côté d'un truc aussi gros que moi x) Je vais faire quelques autres tests voir d'où ça peut clocher, je te tiens au courant. | |
|
| |
Light
Nombre de messages : 224 Age : 27 Localisation : quelque part dans un monde sans fin Logiciel de Création : The Gimp et un peu photoshop Date d'inscription : 18/06/2010
| Sujet: Re: cadre à côté du forum Lun 06 Aoû 2012, 20:55 | |
| Ok, merci beaucoup beaucoup beaucoup beaucoup > | |
|
| |
Ella'
Nombre de messages : 4063 Age : 31 Logiciel de Création : Suite Adobe, Sketch, Suite Affinity Date d'inscription : 19/02/2008
| Sujet: Re: cadre à côté du forum Jeu 09 Aoû 2012, 16:52 | |
| Oups, j'avais oublié ce topic T_T, je suis vraiment désolée ...
J'ai essayé une autre chose qui fonctionne sur mon forum de test, en espérant que ça soit la même chose sur ton forum n_n
Dans tes templates remplace l'ancien code des block :
- Code:
-
<div class="boxcoulissante" style="position: absolute; top: 800px; "> <span class="boxtoproundtitle">Tops-Partenaires</span> <div style="width: 200px; text-align: center;" class="boxmenu"> <a href="http://www.mysteryorphanage.com/">www.</a>Mystery Orphanage <br /><a href="http://welcome-to-inazuma.forumactif.com/">www.</a>Sekai No Chousen <br /><a href="http://newday-thelastchance.forum-canada.com">www.</a>New Day <br /><a href="http://under-graph.forumactif.fr/">www.</a>Under Graph <br /> </div> </div>
<div class="boxcoulissante" style="position: absolute; top: 180px; "> <span class="boxtoproundtitle">Votez pour le forum</span> <div style="width: 200px; text-align: center;" class="boxmenu"> <a href="http://www.root-top.com/topsite/korben/in.php?ID=12469">♠</a>.... <a href="http://www.root-top.com/topsite/moonlighttoprpg/in.php?ID=2778">♠</a>..... <a href="http://www.root-top.com/topsite/blackycalimera/in.php?ID=3094">♠</a>.... <a href="http://www.root-top.com/topsite/abysses/in.php?ID=6174">♠</a>.... <a href="http://www.root-top.com/topsite/titop/in.php?ID=1629">♠</a>.... <a href="http://www.root-top.com/topsite/forumrpg/in.php?ID=6961">♠</a> </div> </div> par celui ci : - Code:
-
<div class="boxcoulissante" style="position: absolute; top: 800px; "> <span>Tops-Partenaires</span> <div style="width: 200px; text-align: center;" > <a href="http://www.mysteryorphanage.com/">www.</a>Mystery Orphanage <br /><a href="http://welcome-to-inazuma.forumactif.com/">www.</a>Sekai No Chousen <br /><a href="http://newday-thelastchance.forum-canada.com">www.</a>New Day <br /><a href="http://under-graph.forumactif.fr/">www.</a>Under Graph <br /> </div> </div>
<div class="boxcoulissante" style="position: absolute; top: 180px; "> <span>Votez pour le forum</span> <div style="width: 200px; text-align: center;"> <a href="http://www.root-top.com/topsite/korben/in.php?ID=12469">♠</a>.... <a href="http://www.root-top.com/topsite/moonlighttoprpg/in.php?ID=2778">♠</a>..... <a href="http://www.root-top.com/topsite/blackycalimera/in.php?ID=3094">♠</a>.... <a href="http://www.root-top.com/topsite/abysses/in.php?ID=6174">♠</a>.... <a href="http://www.root-top.com/topsite/titop/in.php?ID=1629">♠</a>.... <a href="http://www.root-top.com/topsite/forumrpg/in.php?ID=6961">♠</a> </div> </div> J'ai juste enlevé les class="boxtoproundtitle" et class="boxmenu" car ils ne figurent pas dans ton CSS ô_Ô.
Ensuite, remplace le dernier CSS que je t'ai donné par - Code:
-
.boxcoulissante{ right:0px; -webkit-transition:width 0.4s ease-in-out; -o-transition:width 0.4s ease-in-out; -moz-transition:width 0.4s ease-in-out; transition:width 0.4s ease-in-out; width:20px; overflow:hidden; white-space: nowrap; }
.boxcoulissante:hover{ right:0px; -webkit-transition:width 0.4s ease-in-out; -o-transition:width 0.4s ease-in-out; -moz-transition:width 0.4s ease-in-out; transition:width 0.4s ease-in-out; width:200px; } Là en fait elle ne coulisse plus de droite à gauche, mais elle s'agrandit de droite à gauche, mais à priori on obtient le même effet visuel Je croise les doigts pour que ça fonctionne ! | |
|
| |
Light
Nombre de messages : 224 Age : 27 Localisation : quelque part dans un monde sans fin Logiciel de Création : The Gimp et un peu photoshop Date d'inscription : 18/06/2010
| Sujet: Re: cadre à côté du forum Ven 10 Aoû 2012, 16:46 | |
| Bah ça marche, mais le beug reste le même >< Il y a toujours le texte à gauche et quand on passe la souris dessus, ça coulisse TTnTT. Mais il ne faut pas mettre une image ou un bouton pour que quand on passe la souris dessus ça marche ^^? *ne sait pas si elle s'est fait comprendre ><* | |
|
| |
Ella'
Nombre de messages : 4063 Age : 31 Logiciel de Création : Suite Adobe, Sketch, Suite Affinity Date d'inscription : 19/02/2008
| |
| |
Light
Nombre de messages : 224 Age : 27 Localisation : quelque part dans un monde sans fin Logiciel de Création : The Gimp et un peu photoshop Date d'inscription : 18/06/2010
| Sujet: Re: cadre à côté du forum Dim 12 Aoû 2012, 09:12 | |
| Nan mais laisse tomber pour l'image x)
Mais oui, je vois sur ton fow >< Ca marche ><
Mais regarde en faite ce que ça me fait >< : Faut cliquer ici
| |
|
| |
Ella'
Nombre de messages : 4063 Age : 31 Logiciel de Création : Suite Adobe, Sketch, Suite Affinity Date d'inscription : 19/02/2008
| |
| |
Light
Nombre de messages : 224 Age : 27 Localisation : quelque part dans un monde sans fin Logiciel de Création : The Gimp et un peu photoshop Date d'inscription : 18/06/2010
| Sujet: Re: cadre à côté du forum Dim 12 Aoû 2012, 19:34 | |
| Ah oui, c'est vrai que beaucoup de mes templates sont modifiés >< Mais là, je l'ai mis dans index_body et ça change rien TTnTT
Oui, c'est très étrange comme tu dis TTnTT Mais en même temps j'ai mis la masse de codes qui servent à rien sur le mien >< | |
|
| |
Ella'
Nombre de messages : 4063 Age : 31 Logiciel de Création : Suite Adobe, Sketch, Suite Affinity Date d'inscription : 19/02/2008
| |
| |
Light
Nombre de messages : 224 Age : 27 Localisation : quelque part dans un monde sans fin Logiciel de Création : The Gimp et un peu photoshop Date d'inscription : 18/06/2010
| Sujet: Re: cadre à côté du forum Lun 13 Aoû 2012, 13:26 | |
| ouais, je vais essayer ça x) au pire, j'ai tout les bons templates en double XD je te redis | |
|
| |
Light
Nombre de messages : 224 Age : 27 Localisation : quelque part dans un monde sans fin Logiciel de Création : The Gimp et un peu photoshop Date d'inscription : 18/06/2010
| Sujet: Re: cadre à côté du forum Lun 13 Aoû 2012, 13:36 | |
| DP désolée, mais j'ai mis TOUS mes templates par défaut et voilà le résultat -_- :
BOUH | |
|
| |
Ella'
Nombre de messages : 4063 Age : 31 Logiciel de Création : Suite Adobe, Sketch, Suite Affinity Date d'inscription : 19/02/2008
| |
| |
Light
Nombre de messages : 224 Age : 27 Localisation : quelque part dans un monde sans fin Logiciel de Création : The Gimp et un peu photoshop Date d'inscription : 18/06/2010
| Sujet: Re: cadre à côté du forum Lun 13 Aoû 2012, 15:59 | |
| oui, il doit y avoir un bug avec mon forum ><
Mmmmmh attends, je t'envoie un MP ^^ | |
|
| |
Ella'
Nombre de messages : 4063 Age : 31 Logiciel de Création : Suite Adobe, Sketch, Suite Affinity Date d'inscription : 19/02/2008
| Sujet: Re: cadre à côté du forum Lun 13 Aoû 2012, 18:59 | |
| | |
|
| |
Light
Nombre de messages : 224 Age : 27 Localisation : quelque part dans un monde sans fin Logiciel de Création : The Gimp et un peu photoshop Date d'inscription : 18/06/2010
| Sujet: Re: cadre à côté du forum Lun 13 Aoû 2012, 19:41 | |
| MERCI MA ELLA \o/ T'es la meilleure du monde =u= si j'étais américaine je demanderai à dieu de te bénir, sauf que je suis pas américaine xD | |
|
| |
Contenu sponsorisé
| Sujet: Re: cadre à côté du forum | |
| |
|
| |
| cadre à côté du forum | |
|