Je veux comprendre la différence de ces deux merci

Largeur maximale: 100px image

Largeur: 100px image

body{
      max-width: 1080px;
      width: 1080px;
      background-color: floralwhite;
      margin:0px;
      padding: 0px;
    }

p{
      width:100px; /* and max-width of 100px; */
      padding: 20px;
      margin:0px;
      float:left;
    }
0
theweebokid 24 août 2017 à 15:17

2 réponses

La propriété max-width est utilisée pour définir la largeur maximale d'un élément.

Cela empêche la valeur de la propriété width de devenir supérieure à max-width.

Remarque : la valeur des max-width propriétés de remplacement width.

Donc, si les deux sont spécifiés dans les styles, alors si la propriété width est inférieure à max-width alors la propriété width sera appliquée, sinon la propriété max-width sera appliquée à la place.

Je pense que si vous spécifiez le max-width seulement, la propriété width sera par défaut "auto", mais sera toujours limitée au max-width spécifié.

0
Abdullah Fadhel 24 août 2017 à 12:47

L'attribut max-width n'utilise l'intégralité de width que si nécessaire, selon le contenu ou padding. L'attribut width utilisera toujours le montant spécifié (dans votre cas 100px).

Voir mon exemple ici.

Pour en savoir plus, consultez MDN:

largeur max - La propriété CSS max-width est utilisée pour définir la largeur maximale d'un élément. Cela empêche la valeur utilisée de la propriété width de devenir supérieure à la valeur spécifiée par max-width.

largeur - La propriété width spécifie la largeur d'un élément. Par défaut, la propriété définit la largeur de la zone de contenu. Si box-sizing est défini sur border-box, il détermine à la place la largeur de la zone de bordure.

0
Topr 24 août 2017 à 12:39