•  27-10-2019
  •  | 
  •  

Question

Ok. Je veux créer div qui:
1. est aussi grand que le texte est
2. mais il a sa taille minimale et un maximum

Et dire à ma raison pour laquelle cette ligne de CSS fait ma hauteur maximum de la hauteur au lieu de la taille du texte ou de la hauteur minimale? 

div#me{max-height:40%;min-height:20%;background-color:silver;}

code complet: 

<head>
<meta http-equiv="Content-Language" content="pl" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>

<html>
<style type="text/css">
html {width:100%;height:100%;}
html div{margin-left:3%;margin-top:1%;width:94%;height:100%;background-color:black;}
div#me{max-height:40%;min-height:20%;background-color:silver;}
</style>

<div>
<div id="me">
TEXT<br/>
TEXT<br/>
</div>



</div>

</html>
Était-ce utile?

La solution

vous allez ici:

http://jsfiddle.net/bgtJk/2/

La question que vous aviez était que les règles de html div étaient appliquées à les divs .

Ainsi, la div intérieure était dit avoir height: 100%; pas ce que vous vouliez, et la cause de votre problème.

Pour résoudre ce problème, je spécifiait un id sur la div externe.

Maintenant, le #me de div varie en hauteur en fonction du contenu - de min-height:20% à max-height:40%, et partout entre en fonction de la hauteur du texte. Si le texte est trop grand, il débordera, au lieu d'augmenter la hauteur du div, comme celui-ci . Cela ne semble pas être un comportement particulièrement souhaitable.

Êtes-vous sûr que vous ne voulez pas seulement comme ça:
http://jsfiddle.net/bgtJk/4/

Le texte déterminera la hauteur du div.

Ou comme ça?
http://jsfiddle.net/bgtJk/5/

Le div sera au moins haute 20%, mais peut se développer aussi grand que nécessaire.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top