Problème de texte sur le panneau d'affichage

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Problème de texte sur le panneau d'affichage

Message par Magda Sully le Ven 11 Mai 2012 - 14:12

Bonjour à tous,
je suis en train de changer l'apparence du panneau d'affichage sur mon forum, en y insérant un tableau à onglet.
J'ai quelques connaissances en HTML et CSS, cependant, j'ai un soucis avec mon texte auquel je n'ai pas pu remédier.
En fait, lorsque je tape mon texte, tout est écrit sur la même ligne, superposé, et ça fait un un espèce de gribouillis pas possible.
J'ai beau chercher, je n'ai pas trouvé ce qui clochait.

Voici le code HTML :
Code:
<div id="les_onglets">
    <ul><li id="o_1" class="onglet_selectionner" onclick="changeOnglet(this);">Onglet 1</li>
        <li id="o_2" class="onglet" onclick="changeOnglet(this);">Onglet 2</li>
        <li id="o_3" class="onglet" onclick="changeOnglet(this);">Onglet 3</li>
        <li id="o_4" class="onglet" onclick="changeOnglet(this);">Onglet 4</li>
        <li id="o_5" class="onglet" onclick="changeOnglet(this);">Onglet 5</li>
        </ul>
        <div class="clear"><div id="les_contenus">
    <div id="co_1" class="contenu">Exemple de tableau par onglet</div>
    <div id="co_2" class="contenu" style="display: none;">Mon contenu 2</div>
    <div id="co_3" class="contenu" style="display: none;">Mon contenu 3</div>
    <div id="co_4" class="contenu" style="display: none;">Mon contenu 4</div>
    <div id="co_5" class="contenu" style="display: none;">Mon contenu 5</div>
</div></div></div>

Et le code CSS :
Code:
.onglet{
  float: left;
  padding: 2px;
  margin-right: 4px;
  margin-bottom: -1px;
  color: #000;
  background: #ffffff;
  border: 1px solid #000000;
  cursor: pointer;
  width: 18%;
  list-style: none;}
 
.onglet_selectionner{
  float: left;
  padding: 2px;
  margin-right: 4px;
  margin-bottom: -1px;
  color: #000;
  background: #ffffff;
  border-top: 1px solid #000000;
  border-right: 1px solid #000000;
  border-left: 1px solid #000000;
  border-bottom: none !important;
  cursor: pointer;
  width: 18%;
  list-style: none;}

.onglet:hover{
  background: #9C1C56;}
     
.clear{
  clear: both;}

.contenu{
  font-size: 10px;
  color: #000;
  background: #ffffff;
  border: 1px solid #000000;
  padding: 20px;
  list-style: none;}

#les_contenus, #les_onglets{
  width: 100%;}

Je n'ai pas encore complété les codes, mais je préférais m'en occuper uniquement lorsque j'aurais trouvé une solution.

Je pense donc que le problème vient d'un de ces codes, mais je n'ai pas trouvé lequel.
Merci d'avance!

PS : Je ne sais pas si c'est normal, mais en tout cas, je ne peux pas poster l'adresse de mon forum pour que vous puissiez voir.


Dernière édition par Magda Sully le Ven 11 Mai 2012 - 15:12, édité 1 fois

Magda Sully
**

Féminin
Messages : 67
Inscrit(e) le : 10/05/2012

http://robotic-earth.forumactif.org/
Magda Sully a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème de texte sur le panneau d'affichage

Message par Pinguino le Ven 11 Mai 2012 - 14:44

Bonjour,


Qu'entendez vous par
lorsque je tape mon texte, tout est écrit sur la même ligne, superposé, et ça fait un un espèce de gribouillis pas possible.

Avez-vous pensé à mettre des balise pour le retour à la ligne et le saut de ligne ?

Cordialement,
Smile

Pinguino
Adminactif
Adminactif

Masculin
Messages : 10213
Inscrit(e) le : 02/05/2004

http://www.forumactif.com
Pinguino a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème de texte sur le panneau d'affichage

Message par Magda Sully le Ven 11 Mai 2012 - 15:10

Ce n'était pas un problème de balise, puisque mon but était de faire un tableau, et toutes les balises <td> et <tr> étaient là.
Finalement, j'ai réussis à trouver ce qui clochait, c'était juste un problème d'interligne. J'ai donc rajouté au CSS une ligne "Line-height: 100%" et ça a marché.
Merci quand même Very Happy

Magda Sully
**

Féminin
Messages : 67
Inscrit(e) le : 10/05/2012

http://robotic-earth.forumactif.org/
Magda Sully a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum