Problème de texte sur le panneau d'affichage

2 participants

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 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

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 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

Pinguino
Adminactif
Adminactif

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

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 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

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

- Sujets similaires

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