Désolidariser les onglets du contenu
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1 • Partagez
Désolidariser les onglets du contenu
Bonjour, je reviens vers vous car j'ai une petite question. La réponse est certainement sous mon nez mais, j'ai eu beau retourner le problème dans tous les sens, la solution ne veut pas me sauter aux yeux ^^"
Je m'occupe du codage d'un forum et j'essaye de mettre le message de la page d'accueil en onglets. Tout va bien, les onglets sont mis, ils fonctionnent à merveille. Seulement, j'aimerais que tous mes onglets soient au dessus du contenu et il y en a un qui refuse obstinément de le faire :
C'est l'onglet sélectionné qui pose problème. J'ai eu beau changer des paramètres CSS, ça ne change rien du tout. Je viens donc vous demander si quelqu'un à une solution à mon problème ^^
Ma PA
Mon CSS
Merci à la personne qui pourra m'aider ~
Je m'occupe du codage d'un forum et j'essaye de mettre le message de la page d'accueil en onglets. Tout va bien, les onglets sont mis, ils fonctionnent à merveille. Seulement, j'aimerais que tous mes onglets soient au dessus du contenu et il y en a un qui refuse obstinément de le faire :
C'est l'onglet sélectionné qui pose problème. J'ai eu beau changer des paramètres CSS, ça ne change rien du tout. Je viens donc vous demander si quelqu'un à une solution à mon problème ^^
Ma PA
- Code:
<script src="http://testoforum.forum-actif.net/h1-onglets"></script><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">Texte texte texte texte texte texte texte texte texte texte<br> texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte<br> texte texte texte texte texte texte texte texte texte texte texte texte</div>
<div id="co_2" class="contenu" style="display: none;">Texte texte texte texte texte texte texte texte texte texte<br> texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte<br> texte texte texte texte texte texte texte texte texte texte texte texte</div>
<div id="co_3" class="contenu" style="display: none;">Texte texte texte texte texte texte texte texte texte texte<br> texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte<br> texte texte texte texte texte texte texte texte texte texte texte texte</div>
<div id="co_4" class="contenu" style="display: none;">Texte texte texte texte texte texte texte texte texte texte<br> texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte<br> texte texte texte texte texte texte texte texte texte texte texte texte</div>
<div id="co_5" class="contenu" style="display: none;">Texte texte texte texte texte texte texte texte texte texte<br> texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte texte<br> texte texte texte texte texte texte texte texte texte texte texte texte</div>
</div></div></div>
Mon CSS
- Code:
/*ONGLETS PA*/
.onglet{
padding-bottom : 10px;
list-style: none;
float: left;
padding : 2px;
margin-right: 4px;
color: #000;
background: #ffffff;
cursor: onclick;
width: 18%;
-moz-border-radius: 5px ;
-webkit-border-radius:5px;
-border-radius:5px;
-khtml-border-radius:5px;
text-align : center;
valign : center;
}
.onglet_selectionner{
padding-bottom : 10px;
-moz-border-radius: 5px ;
-webkit-border-radius:5px;
-border-radius:5px;
-khtml-border-radius:5px;
float: left;
margin-right: 4px;
color: #000;
background: #ffffff;
cursor: onclick;
width: 18%;
list-style: none;
text-align : center;
valign : center;
}
.onglet:hover{
background: #FFFFFF;
}
.clear{
clear: both;}
.contenu{
margin : 10px;
color: #000;
background: #ffffff;
padding-bottom: 10px;
padding-top: 10px;
list-style: none;
-moz-border-radius: 5px ;
-webkit-border-radius:5px;
-border-radius:5px;
-khtml-border-radius:5px;
}
#les_contenus, #les_onglets{
width: 100%;}
Merci à la personne qui pourra m'aider ~
Dernière édition par Laru le Mar 9 Aoû 2011 - 17:04, édité 1 fois
Re: Désolidariser les onglets du contenu
Bonsoir,
En ajoutant une marge en dessous des onglet, ça fonctionne:
Cordialement.
En ajoutant une marge en dessous des onglet, ça fonctionne:
- Code:
/*ONGLETS PA*/
.onglet{
list-style: none;
float: left;
padding: 2px;
margin-right: 4px;
margin-bottom: 5px;
color: #000;
background: #ffffff;
cursor: onclick;
width: 18%;
-moz-border-radius: 5px ;
-webkit-border-radius:5px;
-border-radius:5px;
-khtml-border-radius:5px;
text-align : center;
valign : center;
}
.onglet_selectionner{
padding: 2px;
-moz-border-radius: 5px ;
-webkit-border-radius:5px;
-border-radius:5px;
-khtml-border-radius:5px;
float: left;
margin-right: 4px;
margin-bottom: 5px;
color: #000;
background: #ffffff;
cursor: onclick;
width: 18%;
list-style: none;
text-align : center;
valign : center;
}
.onglet:hover{
background: #FFFFFF;
}
.clear{
clear: both;}
.contenu{
margin : 10px;
color: #000;
background: #ffffff;
padding-bottom: 10px;
padding-top: 10px;
list-style: none;
-moz-border-radius: 5px ;
-webkit-border-radius:5px;
-border-radius:5px;
-khtml-border-radius:5px;
}
#les_contenus, #les_onglets{
width: 100%;}
Cordialement.
Invité- Invité
Re: Désolidariser les onglets du contenu
Bonjour, Où en-est votre problème ? Deux solutions :
A bientôt sur ForumActif |
Invité- Invité
Sujets similaires
» Comment modifier la couleur des onglets du tableau à onglets ?
» Comment agrandir les onglets du tableau à onglets ?
» catégories en onglets + onglets sur la droite
» Arrondir des onglets du tableau à onglets
» Problème d'affichage du contenu des onglets contenant les infos de profil dans la page d'affichage des sujets
» Comment agrandir les onglets du tableau à onglets ?
» catégories en onglets + onglets sur la droite
» Arrondir des onglets du tableau à onglets
» Problème d'affichage du contenu des onglets contenant les infos de profil dans la page d'affichage des sujets
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum