Accueil
Créer un forumProblème de 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
Problème de QEEL
par MissDevilsJuly Mar 28 Fév 2012 - 23:02
Bonjour! J'ai un petit problème avec mon QEEL. L'effet en lui-même est très bien, mais il y a un truc que j'essais de faire et que je n'y parviens pas.
Voici ce que j'ai:
- Spoiler:
Et voici ce que je cherche à faire:
- Spoiler:
Bref, j'aimerais faire en sorte que chaque partie du texte soit encadrée, mais je ne sais pas comment le faire dans le css. J'ai essayé de faire background-color:...., mais puisque j'ai déjà mis une image de fond, ça a annulé le tout. Quelqu'un peut-il m'aider? 
Voici mon CSS:
- Spoiler:
- Code:
/* Sélecteur de couleur */
.colorpicker {
width: 356px;
height: 176px;
overflow: hidden;
position: absolute;
background: url(http://tinyurl.com/colorpickerimg/colorpicker_background.png);
font-family: Arial, Helvetica, sans-serif;
display: none;
}
.colorpicker_color {
width: 150px;
height: 150px;
left: 14px;
top: 13px;
position: absolute;
background: #f00;
overflow: hidden;
cursor: crosshair;
}
.colorpicker_color div {
position: absolute;
top: 0;
left: 0;
width: 150px;
height: 150px;
background: url(http://tinyurl.com/colorpickerimg/colorpicker_overlay.png);
}
.colorpicker_color div div {
position: absolute;
top: 0;
left: 0;
width: 11px;
height: 11px;
overflow: hidden;
background: url(http://tinyurl.com/colorpickerimg/colorpicker_select.gif);
margin: -5px 0 0 -5px;
}
.colorpicker_hue {
position: absolute;
top: 13px;
left: 171px;
width: 35px;
height: 150px;
cursor: n-resize;
}
.colorpicker_hue div {
position: absolute;
width: 35px;
height: 9px;
overflow: hidden;
background: url(http://tinyurl.com/colorpickerimg/colorpicker_indic.gif) left top;
margin: -4px 0 0 0;
left: 0px;
}
.colorpicker_new_color {
position: absolute;
width: 60px;
height: 30px;
left: 213px;
top: 13px;
background: #f00;
}
.colorpicker_current_color {
position: absolute;
width: 60px;
height: 30px;
left: 283px;
top: 13px;
background: #f00;
}
.colorpicker input {
background-color: transparent;
border: 1px solid transparent;
position: absolute;
font-size: 10px;
font-family: Arial, Helvetica, sans-serif;
color: #898989;
top: 4px;
right: 11px;
text-align: right;
margin: 0;
padding: 0;
height: 11px;
}
.colorpicker_hex {
position: absolute;
width: 72px;
height: 22px;
background: url(http://tinyurl.com/colorpickerimg/colorpicker_hex.png) top;
left: 212px;
top: 142px;
}
.colorpicker_hex input {
right: 6px;
}
.colorpicker_field {
height: 22px;
width: 62px;
background-position: top;
position: absolute;
}
.colorpicker_field span {
position: absolute;
width: 12px;
height: 22px;
overflow: hidden;
top: 0;
right: 0;
cursor: n-resize;
}
.colorpicker_rgb_r {
background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_rgb_r.png);
top: 52px;
left: 212px;
}
.colorpicker_rgb_g {
background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_rgb_g.png);
top: 82px;
left: 212px;
}
.colorpicker_rgb_b {
background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_rgb_b.png);
top: 112px;
left: 212px;
}
.colorpicker_hsb_h {
background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_hsb_h.png);
top: 52px;
left: 282px;
}
.colorpicker_hsb_s {
background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_hsb_s.png);
top: 82px;
left: 282px;
}
.colorpicker_hsb_b {
background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_hsb_b.png);
top: 112px;
left: 282px;
}
.colorpicker_submit {
position: absolute;
width: 22px;
height: 22px;
background: url(http://tinyurl.com/colorpickerimg/colorpicker_submit.png) top;
left: 322px;
top: 142px;
overflow: hidden;
}
.colorpicker_focus {
background-position: center;
}
.colorpicker_hex.colorpicker_focus {
background-position: bottom;
}
.colorpicker_submit.colorpicker_focus {
background-position: bottom;
}
.colorpicker_slider {
background-position: bottom;
}
a {text-decoration: none;}
a:hover { text-decoration: none!important; }
.secondarytitle{
background-image: url('');
background-position: center;
background-repeat: no-repeat;
height: 50px;}
/* TITRES DES CATEGORIE */
a.forumlink:link, a.forumlink:visited {
background-color: #transparent;
text-shadow: 0 0 8px #435f56;
font-family: Times new roman;
color: #47655b;
text-align: center;
display:block;
font-size: 24px;
}
.name{
font-style: bold;
font-size: 16px;
font-family: Trajan pro;
text-shadow: 0px 4px 4px #000000;
text-transform: uppercase; /* Majuscules lors du déplacement */
}
i {
font-style: bold;
text-shadow: 3px 3px 3px #000000;
filter: dropshadow(color=#000000, offx=3, offy=3);
}
a.forumlink:hover {
color: #6EBDA3 !important;
text-decoration: none;
text-shadow: 0 0 8px #435f56;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
}
/*cadre avatar*/
.postdetails.poster-profile a img {
border-radius:15px;
-moz-border-radius-bottomright:px;
-moz-border-radius-topleft:px;
-moz-border-radius-topright:px;
border: 8px solid #000000;
shadow: 3px 3px 3px #000000;}
.statistiques
{
border:0px;
background-image: url('http://img850.imageshack.us/img850/2914/qeel01e.png');
background-repeat: no-repeat;
background-position: center;
height:466px;
}
Voici mon template index_body:
- Spoiler:
- Code:
{JAVASCRIPT}
<!-- BEGIN message_admin_index -->
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
<!-- BEGIN message_admin_titre -->
<tr>
<td class="catHead" height="28"><span class="cattitle">{message_admin_index.message_admin_titre.MES_TITRE}</span></td>
</tr>
<!-- END message_admin_titre -->
<!-- BEGIN message_admin_txt -->
<tr>
<td class="row1" rowspan="3" align="center" valign="middle">
<div class="gensmall">{message_admin_index.message_admin_txt.MES_TXT}</div>
</td>
</tr>
<!-- END message_admin_txt -->
</table>
<!-- END message_admin_index -->
<!-- BEGIN switch_user_login_form_header -->
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
<!-- BEGIN switch_fb_connect_no -->
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
<tr>
<td class="row1" align="center">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td><span class="genmed">{L_USERNAME}:</span> </td>
<td><input class="post" type="text" size="10" name="username"/> </td>
<td>
<input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
<span class="gensmall">{L_AUTO_LOGIN}</span>
</td>
</tr>
<tr>
<td><span class="genmed">{L_PASSWORD}:</span> </td>
<td><input class="post" type="password" size="10" name="password"/> </td>
<td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
</tr>
</table>
</td>
</tr>
</table>
<!-- END switch_fb_connect_no -->
<!-- BEGIN switch_fb_connect -->
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
<tr>
<td valign="top" width="100%" class="row1" align="center">
<table width="100%">
<tr>
<td width="55%" valign="middle" align="right">
<table class="right">
<tr>
<td><span class="genmed">{L_USERNAME}:</span> </td>
<td><input class="post" type="text" size="10" name="username"/> </td>
<td>
<input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
<span class="gensmall">{L_AUTO_LOGIN}</span>
</td>
</tr>
<tr>
<td><span class="genmed">{L_PASSWORD}:</span> </td>
<td><input class="post" type="password" size="10" name="password"/> </td>
<td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
</tr>
</table>
</td>
<td width="10%" align="center" valign="middle">
<span class="genmed fb_or">{switch_user_login_form_header.switch_fb_connect.L_OR}</span>
</td>
<td width="35%" class="align_gauche"><fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" v="2" perms="{switch_user_login_form_header.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_header.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button></td>
</tr>
</table>
</td>
</tr>
</table>
<!-- END switch_fb_connect -->
</form>
<!-- END switch_user_login_form_header -->
{CHATBOX_TOP}
{BOARD_INDEX}
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="50%" valign="top">
<!-- BEGIN switch_user_logged_in -->
<span class="gensmall"><a href="{U_MARK_READ}" class="gensmall">{L_MARK_FORUMS_READ}</a>
<!-- END switch_user_logged_in -->
<!-- BEGIN switch_delete_cookies -->
<a href="{switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall">{switch_delete_cookies.L_DELETE_COOKIES}</a>
<!-- END switch_delete_cookies -->
</span>
</td>
<td width="50%" align="right">
<span class="gensmall">
<a href="{U_TODAY_ACTIVE}" class="gensmall">{L_TODAY_ACTIVE}</a>
<a href="{U_TODAY_POSTERS}" class="gensmall">{L_TODAY_POSTERS}</a>
<a href="{U_OVERALL_POSTERS}" class="gensmall">{L_OVERALL_POSTERS}</a>
<!-- BEGIN switch_on_index -->
<!-- BEGIN switch_delete_cookies -->
<a href="{switch_on_index.switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall">{switch_on_index.switch_delete_cookies.L_DELETE_COOKIES}</a>
<!-- END switch_delete_cookies -->
<!-- END switch_on_index -->
</span>
</td>
</tr>
</table>
<!-- BEGIN switch_user_login_form_footer -->
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
<!-- BEGIN switch_fb_connect_no -->
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
<tr>
<td class="row1" align="center">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td><span class="genmed">{L_USERNAME}:</span> </td>
<td><input class="post" type="text" size="10" name="username"/> </td>
<td>
<input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
<span class="gensmall">{L_AUTO_LOGIN}</span>
</td>
</tr>
<tr>
<td><span class="genmed">{L_PASSWORD}:</span> </td>
<td><input class="post" type="password" size="10" name="password"/> </td>
<td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
</tr>
</table>
</td>
</tr>
</table>
<!-- END switch_fb_connect_no -->
<!-- BEGIN switch_fb_connect -->
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
<tr>
<td valign="top" width="100%" class="row1" align="center">
<table width="100%">
<tr>
<td width="55%" valign="middle">
<table class="right">
<tr>
<td><span class="genmed">{L_USERNAME}:</span> </td>
<td><input class="post" type="text" size="10" name="username"/> </td>
<td>
<input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
<span class="gensmall">{L_AUTO_LOGIN}</span>
</td>
</tr>
<tr>
<td><span class="genmed">{L_PASSWORD}:</span> </td>
<td><input class="post" type="password" size="10" name="password"/> </td>
<td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
</tr>
</table>
</td>
<td width="10%" align="center" valign="middle">
<span class="genmed fb_or">{switch_user_login_form_footer.switch_fb_connect.L_OR}</span>
</td>
<td width="35%" class="align_gauche"><fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" v="2" perms="{switch_user_login_form_footer.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_footer.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button></td>
</tr>
</table>
</td>
</tr>
</table>
<!-- END switch_fb_connect -->
</form>
<!-- END switch_user_login_form_footer -->
<!-- BEGIN disable_viewonline -->
<table cellspacing="2" cellpadding="2" width="900" border="0" class="statistiques">
<tr>
<td width="15%"></td>
<td width="50%"><center>
<span class="groupes"> <a href="http://redblossomrpg.forumactif.com/g2-l-alliance"><img src="http://img828.imageshack.us/img828/851/lalliancegroupe.png"></a></span>
<span class="groupes"><a href="http://redblossomrpg.forumactif.com/g7-les-rebelles"><img src="http://img11.imageshack.us/img11/7378/lesrebellesgroupe.png"></a> </span><br><br>
<span class="groupes"> <a href="http://redblossomrpg.forumactif.com/g4-la-confrerie-des-hunters"><img src="http://img684.imageshack.us/img684/5774/laconfreriegroupe.png"></span>
<span class="groupes"> <a href="http://redblossomrpg.forumactif.com/g3-la-meute-lycane"><img src="http://img708.imageshack.us/img708/8154/lameutegroupe.png"></a> </span>
<span class="groupes"> <a href="http://redblossomrpg.forumactif.com/g6-les-goules"><img src="http://img594.imageshack.us/img594/9137/lesgoulesgroupe.png"></span>
<br><br>
<span class="gensmall">{TOTAL_POSTS}. {TOTAL_USERS}
{NEWEST_USER}<br><br>
{TOTAL_USERS_ONLINE}<br>
{LOGGED_IN_USER_LIST}</center></span><br>
<td width="5%"></td>
</tr>
</table>
<table border="0" cellspacing="3" cellpadding="0" width="700" align="center" style="text-align: justify">{L_CONNECTED_MEMBERS}</table>
<!-- 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
});
//]]>
</script>
<!-- END switch_fb_index_login -->
MissDevilsJuly- **
-
Messages : 52
Inscrit(e) le : 27/10/2010 -
Re: Problème de QEEL
par Dr. Karlos Mar 28 Fév 2012 - 23:23
Bonsoir,
Remplacez cette partie dans votre template:
Par celle-ci:
En ce qui concerne le CSS, insérez ce code:
Modifiez background-color: #couleur par la couleur désirée.
Le 5px correspond à l'arrondissement des coins, si vous voulez augmenter l'arrondissement, changez le 5px partout. Le margin-bottom crée un espace entre les deux blocs pour éviter qu'ils se collent.
Cordialement.
Remplacez cette partie dans votre template:
- Code:
<span class="gensmall">{TOTAL_POSTS}. {TOTAL_USERS}
{NEWEST_USER}<br><br>
{TOTAL_USERS_ONLINE}<br>
{LOGGED_IN_USER_LIST}</center></span><br>
<td width="5%"></td>
</tr>
</table>
<table border="0" cellspacing="3" cellpadding="0" width="700" align="center" style="text-align: justify">{L_CONNECTED_MEMBERS}</table>
Par celle-ci:
- Code:
<div id="encaQEEL"><span class="gensmall">{TOTAL_POSTS}. {TOTAL_USERS}
{NEWEST_USER}<br><br></div>
<div id="encaQEEL2">{TOTAL_USERS_ONLINE}<br>
{LOGGED_IN_USER_LIST}</center></span><br>
<td width="5%"></td>
</tr>
</table>
<table border="0" cellspacing="3" cellpadding="0" width="700" align="center" style="text-align: justify">{L_CONNECTED_MEMBERS}</table></div>
En ce qui concerne le CSS, insérez ce code:
- Code:
#encaQEEL, #encaQEEL2 {
background-color: #couleur;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin-bottom: 10px;
}
Modifiez background-color: #couleur par la couleur désirée.
Le 5px correspond à l'arrondissement des coins, si vous voulez augmenter l'arrondissement, changez le 5px partout. Le margin-bottom crée un espace entre les deux blocs pour éviter qu'ils se collent.Cordialement.
Dr. Karlos- Membre actif
-
Messages : 2623
Inscrit(e) le : 03/01/2012
MissDevilsJuly- **
-
Messages : 52
Inscrit(e) le : 27/10/2010 -
Sujets similaires» Problème de superposition de mon texte du qeel et l'image du qeel !
» Problème de qeel
» Problème de QEEL
» Problème QEEL
» Problème QEEL
» Problème de qeel
» Problème de QEEL
» Problème QEEL
» Problème 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