Bonsoir !

Le calcule et le suivant:

  • un header de 100%
  • un premier li de 70%
  • un dexuième li de ... (30%-80px) ?
  • et un troisème li de 80px

Sachant que je souhaite que mon dernier " li " colle à la marge de droite du header. J'ai bien essyer ```
width: 30%-80px;


Une idée ?

2 réponses


otakodes
Réponse acceptée

solution 1 : l'absolute + padding
tu mets un padding right de 80px sur le UL ou le HEADER (en mettant en box-sizing: border-box), tu ajoute aussi une position relative. Ensuite, le LI qui fait 80px tu lui mets une position absolute et tu le place en fait au dessus de l'espace que crée le padding.
http://jsfiddle.net/w67sgwdr/1/

solution 2 : table
tu mets ton UL ou HEADER peut importe qui est le parent de ta list, en display: table tu mets en suite les LI en display: table-cell puis tu mets 70%, auto et 80px aux item successivement, comme c'est un table il va faire le calcul du auto lui même
http://jsfiddle.net/atubadke/

solution 3 (IE 9 et au dessus, et navigateur récent) :
la propriété css "calc", tu peux faire

width: calc(30% - 80px);

voilà

vavoir
Auteur

Solution 3 merci :D