Problème de codes dans une PA en onglets.

par meteorshower. Sam 18 Juin 2011 - 20:13

Bonjour, bonsoir,
Merci d'avance aux personnes qui liront mon sujet et/ou tenteront de m'aider, je vais tenter d'exposer clairement mon problème. J'ai voulu mettre sur mon forum une PA en onglets. J'ai donc codé l'intérieur de deux des trois onglets. Dans mon onglet du milieu, je voulais mettre un système d'images coulissantes, sous forme d'accordéon. Grâce à un sujet sur le fdf, et je remercie beaucoup la personne qui s'est donnée le mal de faire tous ces codes, j'ai réussi à mettre les images comme je le voulais. Jusque là, tout allait bien. Je faisais ceci sur mon forum test, dans la PA. Mais au moment de placer mon code dans ma PA, c'est le drame.. Le premier coup, ça s'affiche impec, no problem, mais quand j'ai édité quelque chose (alors que ça n'avait rien à voir, c'était une phrase quelque part), l'accordéon est devenu plus petit, plus "tassé".

Voici mon forum test, où j'ai mis en haut l'accordéon et je l'ai ensuite placé dans l'onglet. (N.B : Sur mon forum normal, l'accordéon est juste dans l'onglet (donc non dédoublé sur la PA) et ça ne marche quand même pas)

Et voici le code de ma PA -je pense qu'il n'y a pas besoin de donner celui des images coulissantes, vu qu'en dehors de la PA, tout marche parfaitement... Mais si vous en avez tout de même besoin, ou alors que vous avez besoin de mon CSS, aucun problème (:- (et aussi, je sais que je ne suis pas très douée en codage, du coup il se peut que vous trouviez des choses un peu... étranges dans cette PA, des entourloupes etc, n'ayez pas peur ~~et ne me blâmez pas~~ \o/)

En tout cas, merci beaucoup d'avance pour votre aide ! (:

Code:: /

par missx Dim 19 Juin 2011 - 9:29

salut
a part une div de fermeture en trop, le reste n'est pas trop mal !
chez moi ça fonctionne :

Code:: <table align="center"><tr><ts><iframe src="http://isthisasecret.forumactif.org/h2-acoor" frameborder="0" width="600" height="200" scrolling="no"></iframe></td></tr></table> <script type="text/javascript"> // </script><div class="paonglets"> <span class="paonglet_0 paonglet" id="paonglet_accueil" onclick="javascript:change_paonglet('accueil');">come on !</span> <span class="paonglet_0 paonglet" id="paonglet_effectif" onclick="javascript:change_paonglet('effectif');">your staff</span> <span class="paonglet_0 paonglet" id="paonglet_autre" onclick="javascript:change_paonglet('autre');">my friends</span> </div> <div class="contenu_paonglets"> <div class="contenu_paonglet" id="contenu_paonglet_accueil"><div class="fond33"><div class="cita2">welcome to after the rain,</div><div class="cara2">APRÈS LA PLUIE, LE BEAU TEMPS !</div> <table><tbody><tr><td><div class="fond34"><br><br><br><br><div style="width:217px;height:150px; background-color: #F9F9F9; -moz-border-radius: 10px; -webkit-border-radius: 10px; overflow-y: auto; text-align:justify; line-height: 11px; font-family: arial; letter-spacing: -1px; font-size:13px; margin-left:-40px; margin-top:-35px; padding-top:-35px:"> Sed ut perspiciatis, unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam eaque ipsa, quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt, explicabo. Nemo enim ipsam voluptatem, quia voluptas sit, aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos, qui ratione voluptatem sequi nesciunt, neque porro quisquam est, qui dolorem ipsum, quia dolor sit, amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt, ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur?</div></div> </td><td><div class="fond34bis"><br><br><br><br><div style="width:217px;height:149px; background-color: #F9F9F9; -moz-border-radius: 10px; -webkit-border-radius: 10px; overflow-y: auto; text-align:justify; line-height: 11px; font-family: arial; letter-spacing: -1px; font-size:13px; margin-left:30px; margin-top:-35px; padding-top:-35px:">Sed ut perspiciatis, unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam eaque ipsa, quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt, explicabo. Nemo enim ipsam voluptatem, quia voluptas sit, aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos, qui ratione voluptatem sequi nesciunt, neque porro quisquam est, qui dolorem ipsum, quia dolor sit, amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt, ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? </div></div> </td></tr></tbody></table><div class="lililien">règlement contexte scénario<br> avatars groupes</div> </div> </div> <div class="contenu_paonglet" id="contenu_paonglet_effectif"> <table align="center"><tr><ts><iframe src="http://isthisasecret.forumactif.org/h2-acoor" frameborder="0" width="600" height="200" scrolling="no"></iframe></td></tr></table> </div> <div class="contenu_paonglet" id="contenu_paonglet_autre"><div class="fond333"><table><tbody><tr><td><div class="ff"><br><br><div class="titretruc">my lovers,</div> <br><br><br><br><br> <center><img src="http://www.philadelphie.org/calendar/images/48/heart.png" border="0" alt="" /><img src="http://www.philadelphie.org/calendar/images/48/heart.png" border="0" alt="" /><img src="http://www.philadelphie.org/calendar/images/48/heart.png" border="0" alt="" /></center> </div> </td> <td style="border-left: 8px dotted #BB253A;"><br><br><div class="titretruc">my friends,</div><br><div class="fff"><br><br><br><br> <center><img src="http://upload.wikimedia.org/wikipedia/commons/8/81/Farm-Fresh_weather_sun.png" border="0" alt="" /><img src="http://upload.wikimedia.org/wikipedia/commons/8/81/Farm-Fresh_weather_sun.png" border="0" alt="" /><img src="http://upload.wikimedia.org/wikipedia/commons/8/81/Farm-Fresh_weather_sun.png" border="0" alt="" /><img src="http://upload.wikimedia.org/wikipedia/commons/8/81/Farm-Fresh_weather_sun.png" border="0" alt="" /><img src="http://upload.wikimedia.org/wikipedia/commons/8/81/Farm-Fresh_weather_sun.png" border="0" alt="" /><img src="http://upload.wikimedia.org/wikipedia/commons/8/81/Farm-Fresh_weather_sun.png" border="0" alt="" /><br> <img src="http://upload.wikimedia.org/wikipedia/commons/8/81/Farm-Fresh_weather_sun.png" border="0" alt="" /><img src="http://upload.wikimedia.org/wikipedia/commons/8/81/Farm-Fresh_weather_sun.png" border="0" alt="" /><img src="http://upload.wikimedia.org/wikipedia/commons/8/81/Farm-Fresh_weather_sun.png" border="0" alt="" /> <img src="http://upload.wikimedia.org/wikipedia/commons/8/81/Farm-Fresh_weather_sun.png" border="0" alt="" />more, you </center> </td></tr></tbody></table> <center><div class="cita2">pourquoi nous ?</div><div style="padding-top:-20px; margin-top:-20px;"><div class="dessous"><div style="height:110px; overflow-y: auto;">Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio, cumque nihil impedit, quo minus id, quod maxime placeat, facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet, ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.</div></div></div></center> </div> </div></div> <script type="text/javascript"> // </script>

A+

par meteorshower. Dim 19 Juin 2011 - 13:01

Merci beaucoup d'avoir pris le temps de te pencher sur mon cas ! (:
Cependant, je n'y comprends vraiment rien, car chez moi ça ne marche toujours pas Assomé

Après, j'ai essayé de changer les dimensions, j'ai tenté en enlevant les codes html autour des images, j'ai mis des images plus petites et toujours rien ! :/ Ça pourrait venir du css de ma PA en onglets ? Vu que ça marche très bien en dehors de la PA... Confused

par missx Dim 19 Juin 2011 - 13:08

change tes dimensions ici :

Code:: <table><tbody><tr><td><div class="fond34"><br><br><br><br><div style="width:217px;height:150px;

par width:600px;height:200px;
A+

par meteorshower. Dim 19 Juin 2011 - 18:55

Mmh, ça ne marche toujours pas Assomé

Ça modifie la longueur du texte dans l'onglet 1, mais rien dans l'onglet 2 :/

par missx Dim 19 Juin 2011 - 19:36

le code fonctionne chez moi
forum test

par meteorshower. Dim 19 Juin 2011 - 19:46

Le problème, c'est que le code marche parfaitement quand il n'est pas dans des onglets, mais une fois qu'il y est, il ne veut pas s'afficher correctement :/ Comme sur mon forum test,

En dehors, tout va bien, mais une fois dans l'onglet, il se déforme complètement...

par meteorshower. Lun 20 Juin 2011 - 23:52

[Désolée du DP... éè]

Merci de ton aide missx et j'ai "réussi" ! (: En fait, j'ai remarqué que dans le premier onglet, les images s'affichent entières, dans le 2ème, à moitié et dans le 3ème, plus du tout Assomé

Du coup je vais mettre le système coulissant dans le premier onglet. Comme ça, ni vu ni connu (a)
Encore merci, je passe le sujet en résolu ! (: