Problème de mise en forme d'onglet de catégorie Bouton_activeProblème de mise en forme d'onglet de catégorie Bouton_hoverProblème de mise en forme d'onglet de catégorie Fb-hoverProblème de mise en forme d'onglet de catégorie Fb-active
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!

Derniers sujets
» Fiche de Présentation RPG
Problème de mise en forme d'onglet de catégorie EmptySam 30 Mar 2024, 22:07 par Peyton972

» [RPG] Fiche personnage avec bannière
Problème de mise en forme d'onglet de catégorie EmptySam 30 Mar 2024, 22:06 par Peyton972

» Structure de Qui Est En Ligne (1)
Problème de mise en forme d'onglet de catégorie EmptyLun 04 Mar 2024, 23:20 par Peyton972

» Qui Est En Ligne - Utopia
Problème de mise en forme d'onglet de catégorie EmptyDim 24 Déc 2023, 18:16 par romee

» Pack forum complet "Androïd Sylver" RPU (N°2)
Problème de mise en forme d'onglet de catégorie EmptyJeu 02 Nov 2023, 06:42 par Hydrar

» Formulaire de connexion rapide amélioré
Problème de mise en forme d'onglet de catégorie EmptySam 04 Mar 2023, 18:57 par Krager

» Avatar centré dans le profil
Problème de mise en forme d'onglet de catégorie EmptySam 11 Fév 2023, 06:04 par Krager

» Vos partenaires dans le footer
Problème de mise en forme d'onglet de catégorie EmptyMar 07 Fév 2023, 08:40 par Oxtran

-39%
Le deal à ne pas rater :
Pack Home Cinéma Magnat Monitor : Ampli DENON AVR-X2800H, Enceinte ...
1190 € 1950 €
Voir le deal

Partagez
 

Problème de mise en forme d'onglet de catégorie

Voir le sujet précédent Voir le sujet suivant Aller en bas 
http://wishes-world.forums-actifs.com/forum
Irissia
{ Membre }
{ Membre }

Féminin Messages : 27



Problème de mise en forme d'onglet de catégorie Empty
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
MessageSujet: Problème de mise en forme d'onglet de catégorie   Problème de mise en forme d'onglet de catégorie EmptyDim 27 Fév 2011, 09:23
Revenir en haut Aller en bas
http://wishes-world.forums-actifs.com/forum
Irissia
{ Membre }
{ Membre }

Féminin Messages : 27



Problème de mise en forme d'onglet de catégorie Empty
Désolé du double post, mais c'est pour prévenir que j'ai résolu mon soucis, vous pouvez donc classer
MessageSujet: Re: Problème de mise en forme d'onglet de catégorie   Problème de mise en forme d'onglet de catégorie EmptyDim 27 Fév 2011, 13:05
Revenir en haut Aller en bas
 

Problème de mise en forme d'onglet de catégorie

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1

 Sujets similaires

-
» [Résolu] Problème de mise en forme
» Mise en forme d'une PA
» Mise en forme
» Mise en forme d'une PA
» Mise en forme pa

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
CSSActif :: De la théorie à la pratique :: Aide CSS & xHTML :: Problèmes résolus-

Partenaires Or


← Page précédente   ↑ Aller en haut Copyright © CSSActif 2009 - 2013 Tous droits réservés
Créer un forum | ©phpBB | Forum gratuit d'entraide | Signaler un abus | Forum gratuit