Apparence de mes onglets/catégories
3 participants
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
Apparence de mes onglets/catégories
Bonjour !
J'ai mis mes catégories en onglet, avec je ne sais plus quel tutoriel. Bref, voilà ce que j'ai :
J'aimerais savoir comment centrer verticalement le titre de ma catégorie ! J'ai essayé avec le code suivant mais ça n'a pas marché :
Comment faire, est-ce que c'est possible au moins ?
J'aimerais aussi éviter que le titre de ma catégorie (Paperasse par ex) apparaisse en double comme ça, mais je pense que ce n'est pas possible par contre.
Voilà, merci de bien vouloir m'aider
(désolé de poster aussi souvent, je suis accro au forum des forums je crois !)
J'ai mis mes catégories en onglet, avec je ne sais plus quel tutoriel. Bref, voilà ce que j'ai :
J'aimerais savoir comment centrer verticalement le titre de ma catégorie ! J'ai essayé avec le code suivant mais ça n'a pas marché :
- Code:
#nav_cat li {
vertical-align:middle;
}
Comment faire, est-ce que c'est possible au moins ?
J'aimerais aussi éviter que le titre de ma catégorie (Paperasse par ex) apparaisse en double comme ça, mais je pense que ce n'est pas possible par contre.
Voilà, merci de bien vouloir m'aider
(désolé de poster aussi souvent, je suis accro au forum des forums je crois !)
Dernière édition par lunasims57 le Jeu 5 Juin 2014 - 17:24, édité 1 fois
Re: Apparence de mes onglets/catégories
Bonjour luna,
Je ne suis pas un grand spécialiste donc je ne te garantis pas d'arriver à régler ton soucis mais je vais essayé ^^
Essaies donc de mettre ce code là à la place de ton actuel
Je ne suis pas un grand spécialiste donc je ne te garantis pas d'arriver à régler ton soucis mais je vais essayé ^^
Essaies donc de mettre ce code là à la place de ton actuel
- Code:
#nav_cat li {
vertical-align: middle !important;
text-align: center;
}
Re: Apparence de mes onglets/catégories
Bonjour,
Si le code de Angelofdeath117 ne fonctionne pas, vous pouvez essayer comme ça :
Vous devriez avec un code de ce type dans votre css :
Il y a pas mal de petits soucis...
- la ligne border: 10px solid url(https://i.servimg.com/u/f55/18/83/38/44/fond211.jpg); n'est pas correcte et donc pas prise en compte, elle ne sert à rien, une image ne peut pas être mise en bordure via ce code.
- la ligne text-vertical-align: middle; n'est pas correcte non plus, "text-vertical-align" n'est pas une propriété, il s'agit simplement de "vertical-align"
- les important! servent à écraser une valeur mise directement dans la balise de l'élément concerné, ou bien dans un autre code css, ici il ne sert à rien puisque c'est la seule propriété vertical-align précisée pour cet élément.
- la propriété vertical-align est valable entre autre pour des cellules de tableau, ce que l'on peut utiliser ici en ajoutant à ce code css la propriété : display:table-cell;
- cela ne semble rien changer, à cause de la ligne float:left; , que l'on peut cependant retirer.
- on peut alors retirer d'autres propriétés qui ne servent plus, et ajuster les padding, etc,
Ce qui donne :
et pour retrouver la marge entre les onglets, on peut ajouter en plus le code :
Si le code de Angelofdeath117 ne fonctionne pas, vous pouvez essayer comme ça :
Vous devriez avec un code de ce type dans votre css :
- Code:
#nav_cat li {
background: url(http://i55.servimg.com/u/f55/18/83/38/44/fond211.jpg);
border: 10px solid url(http://i55.servimg.com/u/f55/18/83/38/44/fond211.jpg);
border-top-left-radius: 40px;
border-top-right-radius: 40px;
color: #5E3430;
cursor: pointer;
float: left;
font-size: 20px;
font-variant: small-caps;
height: 45px;
list-style: none;
margin-left: 1px;
margin-right: 1px;
padding: 2px 5px 7px;
text-align: center;
text-vertical-align: middle;
vertical-align: middle!important;
width: 188px;
z-index: 1;
}
Il y a pas mal de petits soucis...
- la ligne border: 10px solid url(https://i.servimg.com/u/f55/18/83/38/44/fond211.jpg); n'est pas correcte et donc pas prise en compte, elle ne sert à rien, une image ne peut pas être mise en bordure via ce code.
- la ligne text-vertical-align: middle; n'est pas correcte non plus, "text-vertical-align" n'est pas une propriété, il s'agit simplement de "vertical-align"
- les important! servent à écraser une valeur mise directement dans la balise de l'élément concerné, ou bien dans un autre code css, ici il ne sert à rien puisque c'est la seule propriété vertical-align précisée pour cet élément.
- la propriété vertical-align est valable entre autre pour des cellules de tableau, ce que l'on peut utiliser ici en ajoutant à ce code css la propriété : display:table-cell;
- cela ne semble rien changer, à cause de la ligne float:left; , que l'on peut cependant retirer.
- on peut alors retirer d'autres propriétés qui ne servent plus, et ajuster les padding, etc,
Ce qui donne :
- Code:
#nav_cat li {
background: url(http://i55.servimg.com/u/f55/18/83/38/44/fond211.jpg);
border-top-left-radius: 40px;
border-top-right-radius: 40px;
color: #5E3430;
cursor: pointer;
font-size: 20px;
font-variant: small-caps;
display: table-cell;
width: 200px;
padding: 5px 10px;
text-align: center;
vertical-align: middle;
}
et pour retrouver la marge entre les onglets, on peut ajouter en plus le code :
- Code:
ul#nav_cat_onglets {
display: table;
border-spacing: 3px 0;
}
MlleAlys- Membre actif
- Messages : 5901
Inscrit(e) le : 12/09/2012
Re: Apparence de mes onglets/catégories
Angelofdeath117 : Nan, ça ne change rien ! Merci quand même ! :3
MlleAlys : Je me doutais bien que "text-vertical-align:" ne marchait pas (j'avais un peu bidouillé au pif) mais pour la bordure je ne savais pas !
En tout cas, ces codes marchent comme désiré, merci beaucoup !
Je vais laisser tomber le truc des titres en doubles, je pense que c'est inévitable de toute façon.
Merci du coup de main !
MlleAlys : Je me doutais bien que "text-vertical-align:" ne marchait pas (j'avais un peu bidouillé au pif) mais pour la bordure je ne savais pas !
En tout cas, ces codes marchent comme désiré, merci beaucoup !
Je vais laisser tomber le truc des titres en doubles, je pense que c'est inévitable de toute façon.
Merci du coup de main !
Re: Apparence de mes onglets/catégories
oh pardon, j'ai oublié cela !
Essayez d'ajouter ce code css :
Essayez d'ajouter ce code css :
- Code:
div.table-title h2 {
display: none;
}
MlleAlys- Membre actif
- Messages : 5901
Inscrit(e) le : 12/09/2012
Re: Apparence de mes onglets/catégories
Wahou ça marche aussi ! J'aurais pas cru ! Mercii :3
Sujets similaires
» catégories en onglets + onglets sur la droite
» (Categories par onglet) .. Placement des onglets de catégories.
» Catégories par onglets!
» Catégories par onglets et catégories comprimées
» Catégories par Onglets
» (Categories par onglet) .. Placement des onglets de catégories.
» Catégories par onglets!
» Catégories par onglets et catégories comprimées
» Catégories par Onglets
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