Bonjour à tous
J'ai vérifié avec la fonction rechercher si le problème que j'ai n'avais pas été règlé mais apparement non, désolé d'avance si un sujet le concernant aurait pu m'échapper. Voici tout d'abord une capture d'écran et après je vous expliquerai mon soucis:
http://www.hiboox.fr/go/images/divers/untitled-1,d0b3ffa6ec699e16880ebc446a222673.png.html
Comme vous pouvez le voir, mes onglets ne sont pas collés au forum. J'ai essayé de jouer sur les marges, sur les espaces, j'ai même réduit leur taille pensant que c'était ça le problème mais rien y fait. Est ce alors parce qu'il y en a trop?
Voici mon code CSS:
- Code:
-
/*ONGLET CATEGORIE*/
.ongletCat_nactif { /*Onglet non survolé*/
background-color: #428677;
font-size: 10px;
display: inline-block;
width: 100px;
height: 20px;
cursor: pointer;
border: 1px #196756 solid;
-moz-border-radius:20px;
-webkit-border :20px;
margin-right: 1px;
padding: 3px;
padding-bottom: 4px;
font-weight: bold;
margin-bottom:-25px;/*entre forum et onglets*/
}
.ongletCat_actif { /*Onglet survolé*/
background-color: #428677;
display: inline-block;
font-size: 10px;
width: 100px;
height: 20px;
cursor: pointer;
border: 1px #196756 solid;
-moz-border-radius :20px;
-webkit-border :20px;
margin-right: 1px;
padding: 3px;
padding-bottom:4px;
font-weight: bold;
Et je vous donne ma template aussi au cas où
- Code:
-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
<tr>
<td valign="bottom">
<!-- BEGIN switch_user_logged_in -->
<span class="gensmall">{LAST_VISIT_DATE}
{CURRENT_TIME}
</span>
<!-- END switch_user_logged_in -->
<div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
</td>
<td class="gensmall" align="right" valign="bottom">
<!-- BEGIN switch_user_logged_in -->
<a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a>
<a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a>
<!-- END switch_user_logged_in -->
<a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
</td>
</tr>
</table>
<!-- DEBUT MODIF ONGLETS -->
<script type="text/javascript">
<!--
document.write('<div align="center">
<ul class="conteneur_onglets">
<li onClick="change_cat(1);" class="ongletCat_actif" id="cat_0">Prologue</li>
<li onClick="change_cat(2);" class="ongletCat_nactif" id="cat_1">Le Palais</li>
<li onClick="change_cat(3);" class="ongletCat_nactif" id="cat_2">La ville haute</li>
<li onClick="change_cat(4);" class="ongletCat_nactif" id="cat_3">La ville basse</li>
<li onClick="change_cat(5);" class="ongletCat_nactif" id="cat_4">Background</li>
<li onClick="change_cat(6);" class="ongletCat_nactif" id="cat_5">Hors-jeu</li>
<li onClick="change_cat(7);" class="ongletCat_nactif" id="cat_6">Corbeille</li>
</ul></div>');
var compteur_cat = 1;
function change_cat(numero)
{
if(document.getElementById('categorie_'+numero))
{
/* affichage de la bonne categorie */
$('table[id^=categorie_]').css('display','none');
$('table[id=categorie_'+numero+']').fadeIn();;
/* affichage du bon onglet */
$('.actif').removeClass("actif");
$('.ongletCat[id=ongletCat_'+numero+']').addClass("actif");
}
}
function capture_cat()
{
if(compteur_cat == 1)
{
document.write('<table class="forumline" id="categorie_' + compteur_cat + '" >');
}
else
{
document.write('</table><table class="forumline" id="categorie_' + compteur_cat + '" style="display:none;">');
}
compteur_cat++;
}
//-->
</script>
<!-- BEGIN catrow --><!-- BEGIN tablehead -->
<script type="text/javascript">
<!--
capture_cat();
//-->
</script>
<!-- FIN MODIF ONGLETS -->
<tr>
<th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>
<th nowrap="nowrap" width="150"><div style="width:150px;">{L_LASTPOST}</div></th>
</tr>
<!-- END tablehead -->
<!-- BEGIN cathead -->
<tr>
<!-- BEGIN inc -->
<td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
<!-- END inc -->
<td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">
<h{catrow.cathead.LEVEL} class="hierarchy">
<span class="cattitle">
<a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
</span>
</h{catrow.cathead.LEVEL}>
</td>
<td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right"> </td>
</tr>
<!-- END cathead -->
<!-- BEGIN forumrow -->
<tr>
<!-- BEGIN inc -->
<td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
<!-- END inc -->
<td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle">
<img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
</td>
<td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
<h{catrow.forumrow.LEVEL} class="hierarchy">
<span class="forumlink">
<a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>
</span>
</h{catrow.forumrow.LEVEL}>
<span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
<span class="gensmall">
<!-- BEGIN switch_moderators_links -->
{catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
<!-- END switch_moderators_links -->
{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
</span>
</td>
<!-- BEGIN forum_link_no -->
<td class="row3 over" align="center" valign="middle" height="50">
<span class="gensmall">
<div class="sujets_messages">Messages : {catrow.forumrow.POSTS} | Sujets : {catrow.forumrow.TOPICS}</div>
<div class="derniers_sujets">{catrow.forumrow.LAST_POST}</div></span>
</td>
<!-- END forum_link_no -->
<!-- BEGIN forum_link -->
<td class="row3" colspan="3" align="center" valign="middle" height="50"><span class="gensmall">{catrow.forumrow.forum_link.HIT_COUNT}</span></td>
<!-- END forum_link -->
</tr>
<!-- END forumrow -->
<!-- BEGIN catfoot -->
<tr>
<!-- BEGIN inc -->
<td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
<!-- END inc -->
<td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
</tr>
<!-- END catfoot -->
<!-- BEGIN tablefoot -->
<img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->
Voila... Je suis sur firefox et je vous donne l'adresse de mon forum même si je pense que la capture d'écran suffira:
http://altaris.forumperso.com/
Encore merci d'avance