pb tableau PA avec onglets

[xyz, le dernier recours]

Bonjour Fofoactif!

Alors voilà, je souhaiterai mettre un tableau en page d'accueil avec onglets. J'ai suivi le tuto dessus mais j'ai un problème, j'obtiens ça:

Spoiler:

J'ai tenté le tableau à onglets horizontal, et aussi le vertical mais le problème reste le même, je n'ai pas tous les onglets qui s'alignent dans leurs cases.

J'ai installé à côté des catégories sous onglets aussi. Est-il possible que cela gêne?

mon javascript:

Spoiler:

mon ccs :

Spoiler:

mon HTML!

Spoiler:

C'est quoi qui bugue svp?

[SoraNoHime]

Bonsoir Paty

il manque certains points de la css, parties en rouge à replacer :

.mon_onglet{
display : inline;
float: left;
padding: 2px 10px;
margin-right: 5px;
color: #000;
background: #fff;
border: 1px solid #000;
cursor: pointer;
margin-bottom: -1px;
list-style: none;
}
.mon_onglet:hover{
display : inline;
background: #b8efa1;
}
.mon_onglet_selected{
display : inline;
float: left;
padding: 2px 10px;
margin-right: 5px;
color: #000;
background: #fff;
border-top: 1px solid #000;
border-right: 1px solid #000;
border-left: 1px solid #000;
border-bottom: 1px solid #fff;
cursor: pointer;
margin-bottom: -1px;
list-style: none;}
.clear{
clear: both;
}

Cordialement.

[xyz, le dernier recours]

salut Cma

merci de te pencher sur mon problème u_u.
alors j'ai fait tes changements et le visuel au final reste le même. Il y a forcément un truc pour que cela me fasse un tel schmilblick! je n'ai pas tous les onglets alignés c'est bizarre.

voici mon index body

Spoiler:

Peut-être est-ce ici que ça bloque...

[SoraNoHime]

Tu testes sur XYZ directement ou ailleurs ?

et là c'est pour les onglets forum ou tableaux qu'il reste un pépin ?

PS : peux-tu mettre sous format code tes codages ?

Code:

[/color]au début[color=red]

à la fin ^^ ça sera plus visible

Edit : suis passée voir et j'ai pigé le blème tu as décrit tes options dans la css ainsi :

*tableau onglet/

hors pour décrire c'est

/* description */

c'est cela qui bloque tes codes, avec en plus des

display:inline-block;

à la place des

display:inline;

que je t'avais fournies ça marche impec voir mon forum test.

[xyz, le dernier recours]

le slash et l'étoile ok u_u a c'est fait!
les inline c'est fait

sauf que j'obtiens ceci:


l'encadré du contenu n'est pas rattaché! mdr! désolé mais je n'ai pas encore atteint ton résultat de ton fofo test mais on avance, j'ai les onglets!

PS: j'ai pas compris ton histoire de début et de fin!

[SoraNoHime]

Tu avais choisi quel tableau dans le tuto de base ? 1, 2 ou 3 ?

Tu as un conflit avec le dédikass, quand on cliques sur un onglet on à l'ouverture d'une page vers le site de ce widget, essaie déjà de les intervertir.

repasse moi ta css actuelle, que je vois la différence avec la mienne. ^^

edit : pour le début et la fin 'ai eu un problème d'affichage bbcode en gros 'aimerai que tu me mettes sous balises code ^^

[xyz, le dernier recours]

la voici, j'ai pris la une

Spoiler:

j'ai interverti le dedicass. j'ai constaté aussi ce problème. je vois pas de changement.

[SoraNoHime]

Pour ton dédikass c'est quel genre de code ? un lien, un iframe , un embed, une image dynamique ?

il pose problème au niveau du script aussi du coup, ton tableau ne change pas.

Mets déjà cette css à la place de celle que tu m'as donnée.

Code:

body{
background-repeat:no-repeat;
background-attachment:fixed;
}

/* Pour agrandir la police de la chatbox*/

.chatbox_row_1,
.chatbox_row_2,
.chatbox_row_3,
.chatbox_row_1 a,
.chatbox_row_2 a,
.chatbox_row_3 a {
color: red;
font-size: 14px;
}

/*onglets catégories*/

.my_modified_table{
width: 80%;
margin-left: 10%;
margin-right: 10%;
margin-top: 5px !important;

font-family: Verdana;
}

.my_forum_name{
display:none;
}
.my_img{
width: 10%;
margin-left: 50px;
}
.my_disc{
width: 70%;
text-align:center;
font-size: 15px;
}
.my_stats{

width: 20%;
text-align:center;
}

.myfoo_title{
text-align:center;
width: 100%;
-moz-border-radius: 6px;
border: 4px solid #EAEAEA;

}
.my_title{
text-align:center;
font-size: 16px;
font-family: Arial;
}

.my_cat_body{
border: 3px solid #EEE;
-moz-border-radius: 6px;

}

.my_cat ul{
margin:0;
padding: 0;
width: 800px !important;
}
.my_cat li{
margin-left: 5px;
}
.my_cat_style{
border-top: 1px #666 solid;
border-left: 1px #666 solid;
border-right: 1px #666 solid;
-moz-border-radius-topleft: 6px;
-moz-border-radius-topright: 6px;
text-align:center;
font-size: 14px;
padding-left:10px;
padding-right:10px;
display:inline;
background-color: #EAEAEA;
width: 200px;
font-family: Arial;
font-weight: bold;

}
.my_cat a{
text-decoration: none !important;
color: #000;
}

/*onglets tableau*/


.mon_onglet{
display : inline-block;
float: left;
padding: 2px 10px;
margin-right: 5px;
color: #000;
background: #fff;
border: 1px solid #000;
cursor: pointer;
margin-bottom: -1px;
list-style: none;
}
.mon_onglet:hover{
display : inline-block;
background: #b8efa1;
}
.mon_onglet_selected{
display : inline-block;
float: left;
padding: 2px 10px;
margin-right: 5px;
color: #000;
background: #fff;
border-top: 1px solid #000;
border-right: 1px solid #000;
border-left: 1px solid #000;
border-bottom: 1px solid #fff;
cursor: pointer;
margin-bottom: -1px;
list-style: none;}
.clear{
clear: both;
}
        .mon_contenu{
          color: #000;
          background: #fff;
          border: 1px solid #000;
          padding: 10px;
          line-height: normal;
          font-size: 11px;}
        #mes_contenus, #mes_onglets{
          width: 400px;
          margin: auto;}

[xyz, le dernier recours]

un embed je crois le voilà

Spoiler:

[SoraNoHime]

il manque </a> à la fin de ton code pour pas qu'il empiète sur le tableau ^^

[xyz, le dernier recours]

l'ensemble est ok mais j'ai constaté deux autres problèmes!
- quand je clique sur un onglet ( 2 , 3 ou 4), le contenu de cet onglet ne s'affiche pas, je reste sur le contenu 1! ( on va y arriver tu crois?)
-comment on agrandit ce merveilleux tableau que j'ai tant de mal à mettre en place?

[SoraNoHime]

Déjà pour agrandir le tableau, il faut placer ce que tu veux mettre dedans, ça va déjà prendre en longueur, ensuite pour la largeur change ici :

#mes_contenus, #mes_onglets{
width: 400px;
margin: auto;}

par

#mes_contenus, #mes_onglets{
width: 100%;
margin: auto;}

pour le tableau bizarre , tu as bien installé le code dans le javascript, avec option cochée sur l'index (si dans PA > Affichage > Structures & Hiérarchie tu as mis voir les statistiques sur l'index) ou sur toutes les pages (si cette fois c'est mis sur tout le temps) ? Ton forum me dit qu'il n'y en a pas d'attaché. Avais-tu l'overall_header modifié au moment de la mise en place de la gestion des javascripts ? voir cette annonce : https://forum.forumactif.com/t308422-

[xyz, le dernier recours]

effectivement je n'avais pas vu ce lien et maintenant ça fonctionne.

Merci cma.

Je vais voir maintenant pour customiser tout cela.^^