Accueil
Créer un forumCentrer mon QEEL
2 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1 • Partagez
Centrer mon QEEL
par NCB Mer 3 Sep 2014 - 17:21
Bonjour !
J'ai un petit problème ^^ Je n'arrive pas à centrer mon QEEL que j'ai récupérer en libre service par un code sur un site connu ^^ Malgré plusieurs essais , impossible de mettre les balises au bon endroit apparemment dans le template index body
Si quelqu'un peut m'aider svp !
Ci dessous le code du template à partir du début du QEEl:
J'ai un petit problème ^^ Je n'arrive pas à centrer mon QEEL que j'ai récupérer en libre service par un code sur un site connu ^^ Malgré plusieurs essais , impossible de mettre les balises au bon endroit apparemment dans le template index body
Si quelqu'un peut m'aider svp !
Ci dessous le code du template à partir du début du QEEl:
- Code:
<!-- BEGIN disable_viewonline -->
<!-- [ CREDITS ]
------------------------------------
Template QEEL par 'Christa Lostmindy
Distribution autorisée sur :
L'Enae Volare : http://enaevolare.lostmindy.fr
CSSActif : http://www.css-actif.com/
l'Annuaire FdF : http://www.forumsdeforumactif.com/
----
Utilisation personnelle et non commerciale autorisée
Modification autorisée
Redistribution strictement interdite
----
Il est strictement interdit de retirer
les crédits présents dans ce code.
<script type="text/javascript" src="http://tinyurl.com/var-fa"></script>
--------------------------------------
-->
<center><div valign="middle" id="tableauQeel">
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
<tr>
<td width="200" align="center" valign="middle" rowspan="2">
<div class="imgOnline">
<a href="{U_VIEWONLINE}">
<img src="{L_ONLINE_IMG}" id="i_whosonline" alt="{L_WHO_IS_ONLINE}" />
</a>
</div>
</td>
<td align="center" valign="middle" id="tabBlocGroupes">
<div id="blocGroupes">
<h2>{LEGEND}</h2>
<div class="contenuQeel hauteurFixe noSpaceTitre">
<div class="qeel-groupes">{GROUP_LEGEND}</div>
</div>
</div>
</td>
</tr>
<tr>
<td colspan="2" align="center" valign="middle">
<div class="espace"> </div>
<h2>Activité du forum</h2>
<div class="contenuQeel noSpaceTitre">
<span id="totalUsersOnline">{TOTAL_USERS_ONLINE}</span>
<br />
<span id="loggedInUsers">{LOGGED_IN_USER_LIST}</span>
<!-- BEGIN switch_chatbox_activate -->
</div>
<div class="espace"></div>
<div class="contenuQeel">
<span class="gensmall">
<span id="totalChattersOnline">{TOTAL_CHATTERS_ONLINE}</span>
<br />
{CHATTERS_LIST}
</span>
<!-- END switch_chatbox_activate -->
</div>
</td>
</tr>
</table></center>
<!-- END disable_viewonline -->
{CHATBOX_BOTTOM}
<br clear="all" />
<!-- BEGIN switch_legend -->
<table border="0" cellspacing="3" cellpadding="0" align="center">
<tr>
<td align="center" width="20"><img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" /></td>
<td><span class="gensmall">{L_NEW_POSTS}</span></td>
<td></td>
<td align="center" width="20"><img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" /></td>
<td><span class="gensmall">{L_NO_NEW_POSTS}</span></td>
<td> </td>
<td align="center" width="20"><img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" /></td>
<td><span class="gensmall">{L_FORUM_LOCKED}</span></td>
</tr>
</table>
<!-- END switch_legend -->
{AUTO_DST}
<!-- BEGIN switch_fb_index_login -->
<div id="fb-root"></div>
<script type="text/javascript">
//<![CDATA[
FB.init({
appId: '{switch_fb_index_login.FACEBOOK_APP_ID}',
status: true,
cookie: true,
xfbml: true,
oauth: true
});
//]]>
</script>
<!-- END switch_fb_index_login -->
Dernière édition par NCB le Jeu 4 Sep 2014 - 16:41, édité 1 fois
NCB- **
-
Messages : 53
Inscrit(e) le : 28/12/2013 -
Re: Centrer mon QEEL
par Invité Mer 3 Sep 2014 - 18:15
Bonsoir,
Vous pouvez d'ores et déjà supprimer
car il s'agit d'un attribut de la balise td.
Ensuite, essayez plutôt ainsi :
Ou essayez de placer la première balise div après la seconde.
Si cela ne marche pas, pourrions-nous avoir :
- une capture du rendu
- le CSS correspondant à l'identifiant "tableauQeel"
Merci.
Cordialement.
Vous pouvez d'ores et déjà supprimer
- Code:
valign="middle"
car il s'agit d'un attribut de la balise td.
Ensuite, essayez plutôt ainsi :
- Code:
<div align="center"><div id="tableauQeel">
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
Ou essayez de placer la première balise div après la seconde.
Si cela ne marche pas, pourrions-nous avoir :
- une capture du rendu
- le CSS correspondant à l'identifiant "tableauQeel"
Merci.
Cordialement.
Invité- Invité
Re: Centrer mon QEEL
par NCB Jeu 4 Sep 2014 - 16:22
Salut !
Merci de ta réponse mais ça n'a pas fonctionné. Le QEEL apparaît à droite en bas , au dessus de la chat box qui elle est centrée.
Voici le CSS du QEEL:
Merci de ta réponse mais ça n'a pas fonctionné. Le QEEL apparaît à droite en bas , au dessus de la chat box qui elle est centrée.
Voici le CSS du QEEL:
- Code:
/*------------------------------------
Template QEEL par 'Christa Lostmindy
Distribution autorisée sur :
L'Enae Volare : http://enaevolare.lostmindy.fr
CSSActif : http://www.css-actif.com/
l'Annuaire FdF : http://www.forumsdeforumactif.com/
----
Utilisation personnelle et non commerciale autorisée
Modification autorisée
Redistribution strictement interdite
----
Il est strictement interdit de retirer
les crédits présents dans ce code.
--------------------------------------*/
/****************************************
/* MISE EN FORME GENERALE
/****************************************/
/* mise en page générale */
#tableauQeel {
width: 100%;
padding: 4px;
margin: 0 auto;
color: #000000;
font-size: 12px;
}
/* Liens statistiques */
.liensStats {
margin: 5px 0;
}
.liensStats a:link {
color: #3333cc;
}
.liensStats a:hover,
.liensStats a:active,
.liensStats a:focus {
color: ##E6E6E6;
}
.liensStats a:visited {
color: #3333cc;
}
/* largeur bloc contenant l'image du QEEL*/
.imgOnline {
min-width: 200px;
}
/* espacement entre certains blocs */
.espace {
padding: 3px;
}
/* taille des cellules de tableau */
#tabBlocStats,
#tabBlocGroupes {
width: 50%;
}
#blocStats {
width: auto;
}
#blocGroupes {
width: auto;
}
/*********************************
/* TITRES DU QEEL
/*********************************/
#tableauQeel h2 {
display: inline-block;
font-family: "corbel", Corbel, monospace, serif;
font-size: 16px;
font-weight: bold;
color: #000000;
text-shadow: 0.1em 0.1em 0.2em #000000;
margin-top: 4px;
margin-bottom: 0px;
padding: 4px 10px;
background-color: ;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
-webkit-border-top-left-radius: 15px;
-moz-border-radius-topleft: 15px;
border-top-left-radius: 15px;
-webkit-border-top-right-radius: 15px;
-moz-border-radius-topright: 15px;
border-top-right-radius: 15px;}
/*************************************
/* MISE EN FORME DES BOITES DE CONTENU
/************************************* */
.contenuQeel {
background-color: ;
-webkit-border-radius: 16px;
-moz-border-radius: 16px;
border-radius: 16px;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
padding: 4px;
margin: 2px;
font-size: 12px;
}
.noSpaceTitre {
margin-top: 0;
}
.liste24h {
text-align: center;
}
.deBug td {
background-color: #d1d7dc;
}
/* Ce css permet d'avoir les deux premières boites (statistiques et légendes)
à la même taille en hauteur */
.hauteurFixe {
height: 45px;
overflow: auto;
}
/*************************************
/* MISE EN FORME LISTE DES GROUPES
/************************************* */
.qeel-groupes {
font-size: 0px;
line-height: 0;
text-align: center;
}
.qeel-groupes a {
font-size: 17px;
line-height: normal;
display: inline-block;
padding: 2px 5px;
margin: 1px 4px;
font-variant: small-caps;
font-weight: bold;
background: transparent;
}
/********************************
/* Affichage des crédits
/********************************/
.lostCredits {
color: #999999;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
padding: 2px 4px;
background: transparent;
font-weight: bold;
}
.bulleCredits {
position: relative;
cursor: pointer;
color: #ffffff;
background: ;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
padding: 1px 4px;
}
.bulleCredits > span {
position: absolute;
display: block;
bottom: 150%;
left: -20%;
width: 150px;
background: #000000;
color: #ffffff;
padding: 2px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
opacity: 0;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-ms-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all 0.4s ease;
transform: scale(0) rotate(12deg);
}
.bulleCredits > span:after {
display: block;
content: " ";
width: 0;
border-width: 8px 5px 0 5px;
border-color: #000000 transparent transparent transparent;
border-style: solid;
position: absolute;
bottom: -8px;
left: 5px;
}
.bulleCredits:hover > span,
.bulleCredits:focus > span {
z-index: 500;
opacity: 1;
transform: scale(1) rotate(0);
cursor: default;
}
/*------------------------------------
Template QEEL par 'Christa Lostmindy
http://enaevolare.lostmindy.net
[FIN]
--------------------------------------*/
.bouton-profil {
cursor: pointer; /* curseur au survol */
margin: 2px 0; /* petite marge en haut et en bas */
padding: 2px; /* espacement entre le texte et la bordure */
text-align: center; /* centrage du texte dans le bloc */
/* -- mise en forme -- */
background: #CCCCCC; /* couleur de fond */
border: 3px double #000000; /* bordure */
color: #B74C08; /* couleur texte */
font-size: 11px; /* taille du texte */
font-variant: small-caps; /* effet petites majuscules */
font-weight: bold; /* effet gras */
letter-spacing: 2px; /* espace entre les lettres */
}
.profil-cache {
border: 3px double #000000;
margin: 2px 0;
padding: 2px;
}
NCB- **
-
Messages : 53
Inscrit(e) le : 28/12/2013 -
Re: Centrer mon QEEL
par MlleAlys Jeu 4 Sep 2014 - 16:35
Bonjour,
Essayez avec ce template :
et ce code css :
(certaines largeurs étaient fixées, comme celle de l'image sensée apparaître à gauche, d'où l'espace, et d'autres détails ^^)
Essayez avec ce template :
- Code:
<!-- BEGIN disable_viewonline -->
<!-- [ CREDITS ]
------------------------------------
Template QEEL par 'Christa Lostmindy
Distribution autorisée sur :
L'Enae Volare : http://enaevolare.lostmindy.fr
CSSActif : http://www.css-actif.com/
l'Annuaire FdF : http://www.forumsdeforumactif.com/
----
Utilisation personnelle et non commerciale autorisée
Modification autorisée
Redistribution strictement interdite
----
Il est strictement interdit de retirer
les crédits présents dans ce code.
<script type="text/javascript" src="http://tinyurl.com/var-fa"></script>
--------------------------------------
-->
<center><div valign="middle" id="tableauQeel">
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
<tr>
<td width="0" align="center" valign="middle" rowspan="2">
<div class="imgOnline">
<a href="{U_VIEWONLINE}">
<img src="{L_ONLINE_IMG}" id="i_whosonline" alt="{L_WHO_IS_ONLINE}" />
</a>
</div>
</td>
<td align="center" valign="middle" id="tabBlocGroupes">
<div id="blocGroupes">
<h2>{LEGEND}</h2>
<div class="contenuQeel hauteurFixe noSpaceTitre">
<div class="qeel-groupes">{GROUP_LEGEND}</div>
</div>
</div>
</td>
</tr>
<tr>
<td colspan="2" align="center" valign="middle">
<div class="espace"> </div>
<h2>Activité du forum</h2>
<div class="contenuQeel noSpaceTitre">
<span id="totalUsersOnline">{TOTAL_USERS_ONLINE}</span>
<br />
<span id="loggedInUsers">{LOGGED_IN_USER_LIST}</span>
<!-- BEGIN switch_chatbox_activate -->
</div>
<div class="espace"></div>
<div class="contenuQeel">
<span class="gensmall">
<span id="totalChattersOnline">{TOTAL_CHATTERS_ONLINE}</span>
<br />
{CHATTERS_LIST}
</span>
<!-- END switch_chatbox_activate -->
</div>
</td>
</tr>
</table></center>
<!-- END disable_viewonline -->
{CHATBOX_BOTTOM}
<br clear="all" />
<!-- BEGIN switch_legend -->
<table border="0" cellspacing="3" cellpadding="0" align="center">
<tr>
<td align="center" width="20"><img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" /></td>
<td><span class="gensmall">{L_NEW_POSTS}</span></td>
<td></td>
<td align="center" width="20"><img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" /></td>
<td><span class="gensmall">{L_NO_NEW_POSTS}</span></td>
<td> </td>
<td align="center" width="20"><img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" /></td>
<td><span class="gensmall">{L_FORUM_LOCKED}</span></td>
</tr>
</table>
<!-- END switch_legend -->
{AUTO_DST}
<!-- BEGIN switch_fb_index_login -->
<div id="fb-root"></div>
<script type="text/javascript">
//<![CDATA[
FB.init({
appId: '{switch_fb_index_login.FACEBOOK_APP_ID}',
status: true,
cookie: true,
xfbml: true,
oauth: true
});
//]]>
</script>
<!-- END switch_fb_index_login -->
et ce code css :
- Code:
/*------------------------------------
Template QEEL par 'Christa Lostmindy
Distribution autorisée sur :
L'Enae Volare : http://enaevolare.lostmindy.fr
CSSActif : http://www.css-actif.com/
l'Annuaire FdF : http://www.forumsdeforumactif.com/
----
Utilisation personnelle et non commerciale autorisée
Modification autorisée
Redistribution strictement interdite
----
Il est strictement interdit de retirer
les crédits présents dans ce code.
--------------------------------------*/
/****************************************
/* MISE EN FORME GENERALE
/****************************************/
/* mise en page générale */
#tableauQeel {
width: 100%;
padding: 4px 0;
margin: 0 auto;
color: #000000;
font-size: 12px;
}
/* Liens statistiques */
.liensStats {
margin: 5px 0;
}
.liensStats a:link {
color: #3333cc;
}
.liensStats a:hover,
.liensStats a:active,
.liensStats a:focus {
color: ##E6E6E6;
}
.liensStats a:visited {
color: #3333cc;
}
/* espacement entre certains blocs */
.espace {
padding: 3px;
}
/*********************************
/* TITRES DU QEEL
/*********************************/
#tableauQeel h2 {
display: inline-block;
font-family: "corbel", Corbel, monospace, serif;
font-size: 16px;
font-weight: bold;
color: #000000;
text-shadow: 0.1em 0.1em 0.2em #000000;
margin-top: 4px;
margin-bottom: 0px;
padding: 4px 10px;
background-color: ;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
-webkit-border-top-left-radius: 15px;
-moz-border-radius-topleft: 15px;
border-top-left-radius: 15px;
-webkit-border-top-right-radius: 15px;
-moz-border-radius-topright: 15px;
border-top-right-radius: 15px;}
/*************************************
/* MISE EN FORME DES BOITES DE CONTENU
/************************************* */
.contenuQeel {
background-color: ;
-webkit-border-radius: 16px;
-moz-border-radius: 16px;
border-radius: 16px;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
padding: 4px;
margin: 2px;
font-size: 12px;
}
.noSpaceTitre {
margin-top: 0;
}
.liste24h {
text-align: center;
}
.deBug td {
background-color: #d1d7dc;
}
/* Ce css permet d'avoir les deux premières boites (statistiques et légendes)
à la même taille en hauteur */
.hauteurFixe {
height: 45px;
overflow: auto;
}
/*************************************
/* MISE EN FORME LISTE DES GROUPES
/************************************* */
.qeel-groupes {
font-size: 0px;
line-height: 0;
text-align: center;
}
.qeel-groupes a {
font-size: 17px;
line-height: normal;
display: inline-block;
padding: 2px 5px;
margin: 1px 4px;
font-variant: small-caps;
font-weight: bold;
background: transparent;
}
/********************************
/* Affichage des crédits
/********************************/
.lostCredits {
color: #999999;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
padding: 2px 4px;
background: transparent;
font-weight: bold;
}
.bulleCredits {
position: relative;
cursor: pointer;
color: #ffffff;
background: ;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
padding: 1px 4px;
}
.bulleCredits > span {
position: absolute;
display: block;
bottom: 150%;
left: -20%;
width: 150px;
background: #000000;
color: #ffffff;
padding: 2px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
opacity: 0;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-ms-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all 0.4s ease;
transform: scale(0) rotate(12deg);
}
.bulleCredits > span:after {
display: block;
content: " ";
width: 0;
border-width: 8px 5px 0 5px;
border-color: #000000 transparent transparent transparent;
border-style: solid;
position: absolute;
bottom: -8px;
left: 5px;
}
.bulleCredits:hover > span,
.bulleCredits:focus > span {
z-index: 500;
opacity: 1;
transform: scale(1) rotate(0);
cursor: default;
}
/*------------------------------------
Template QEEL par 'Christa Lostmindy
http://enaevolare.lostmindy.net
[FIN]
--------------------------------------*/
(certaines largeurs étaient fixées, comme celle de l'image sensée apparaître à gauche, d'où l'espace, et d'autres détails ^^)
MlleAlys- Membre actif
- Messages : 5967
Inscrit(e) le : 12/09/2012
Re: Centrer mon QEEL
par NCB Jeu 4 Sep 2014 - 16:41
Magnifique 
Merci beaucoup à toi , ça fonctionne parfaitement
Merci beaucoup à toi , ça fonctionne parfaitement
NCB- **
-
Messages : 53
Inscrit(e) le : 28/12/2013 -
Sujets similaires» Centrer l'image du qeel
» Centrer le QEEL
» Centrer mon Qeel
» centrer le qeel
» Centrer le corps du forum (catégories et QEEL)
» Centrer le QEEL
» Centrer mon Qeel
» centrer le qeel
» Centrer le corps du forum (catégories et QEEL)
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum