Inline-block et Width

**Thunderburst** · 05/02/2013, 16h56

Bonjour à tous,

Je suis confronté à un (petit) problème. Je m'explique :

Je réalise un site web pour une entreprise et entre autres, je réalise une barre de menu latérale.
Cette dernière est donc un bloc, dans laquelle sont contenus 3 autres blocs qui constituent mes 3 liens pour la redirection vers les autres pages.

Mon problème : j'aimerais que mes 3 blocs soient de taille égale, et de façon à remplir entièrement le bloc parent.

J'ai joué avec les longueur en px mais évidemment c'était trop beau pour que les tailles soient identiques

Et le pourcentage ne m'aide pas plus ( 33,333333...%

)

Quelqu'un aurait la solution de ce problème, ou saurait-t'il si elle existe ?

Merci pour vos réponses !

**raydenprod** · 05/02/2013, 17h08

tu enlèves la width de ta div global et tu mets la même taille à tes liens

**Thunderburst** · 05/02/2013, 17h18

Je n'ai pas mis de width à ma div globale (elle fait ainsi la largeur de la page).
Du coup mes 3 blocs ne font que la taille du texte à l'interieur

**Thunderburst** · 05/02/2013, 17h24

Je me suis peut être mal expliqué...
Mes 3 blocs sont des inline-block, donc ils sont les uns à côté des autres dans ma div globale.

**raydenprod** · 05/02/2013, 17h35

pourquoi ne pas mettre un padding de 2px à ta div global et faire trois div de 32% ?

**Thunderburst** · 05/02/2013, 19h34

Ma foi, c'est une bonne idée !
J'étais tellement concentré sur mon problème que n'y avais pas pensé...

Je te remercie

**NoSmoking** · 06/02/2013, 18h40

Bonjour,

Envoyé par raydenprod

pourquoi ne pas mettre un padding de 2px à ta div global et faire trois div de 32% ?

je dois admettre que la logique m'échappe

(3 * 32%) +(2 * 2px) ?= 100%

Envoyé par Thunderburst

Mes 3 blocs sont des inline-block

Il te faut donc tenir compte des whiteSpace.

**Thunderburst** · 07/02/2013, 17h13

Oui je me suis un peu précipité, mais en ayant voulu mettre cela en application, je me suis rendu compte que ça n'allait pas.

J'ai effectivement tenu compte des whitespaces et les ai retiré

En revanche, mes blocs sont séparés par des bordures...
Hélas même si je me dis que je ferais mieux d'abandonner mon idée de 3 blocs de taille identique en en mettant un à 34%, les bordures viennent fausser le résultat...
Pourtant je ne pense pas être le seul à avoir essayé de faire un menu horizontal avec des blocs de taille identique ET avec des bordures pour les séparer...

De plus, j'ai un autre problème :
J'ai un deuxième menu, disons "classique", c'est à dire en longueur sur la gauche de ma page avec une largeur en % et sur sa droite une <div>
(ou plutôt <article>) représentant le contenu de ma page.
Ici c'est un peu le même problème, si j'essaie de régler la largeur de ce bloc en % le résultat n'est pas exact non plus... J'aurais souhaité que sa largeur soit variable, c'est à dire qu'elle complète la largeur du bloc parent...
J'ai essayé avec un "min-width: inherit;" et des choses du genre mais impossible de corriger ce problème également.

Pourtant je pense que les 2 choses que je tente de faire n'ont rien d'extraordinaire pour la conception d'un site, mais là j'avoue que je ne sait plus du tout comment m'y prendre...

En tout cas merci pour vos réponses