7
votes

Min-largeur, max-largeur CSS utilise la plus petite largeur

D'accord, alors qu'est-ce que j'espère faire, c'est créer un div pouvant autosser en fonction du contenu qui y est, mais il devrait utiliser la plus petite largeur possible. Je n'ai aucune idée de la façon de faire cela.

Donc, si j'ai une balise divisée qui a 3 caractères qui ne fait aucun doute sous 200px de large, ce que je veux, c'est que la DIV soit à 200px alors. S'il y a beaucoup plus de texte, j'aimerais que la taille automatique de l'automobile afin que le texte soit adapté.

** Est-ce possible avec Just *** CSS *? ****

** MISE À JOUR **

Laissez-moi voir si je peux expliquer cela mieux. J'ai un div:

xxx

Qu'est-ce que j'espère avoir lieu est si le texte est modifié, il sera toujours d'au moins 200px de large. Comme ceci: xxx

mais s'il s'agissait d'un texte encore plus long, le premier exemple continuerait de s'étendre à l'extérieur du passé 200px: xxx

Cependant, je dispose d'une limite (quantité limitée d'espace) que cela peut aller pour que j'ai besoin de la mettre une largeur maximale. Cela a-t-il de sens ou dois-je préciser les choses plus?


1 commentaires

Vous devrez peut-être utiliser JavaScript.


3 Réponses :


1
votes

Si j'ai compris ce que vous demandez à propos de correctement,

s sont des éléments de blocs, ce qui signifie que par défaut, ils prendront une gamme complète - 100 % de la largeur de l'écran. Essayez d'utiliser l'élément à la place.

espère que cela a aidé, mais nous pouvons vous aider davantage si vous spécifiez le comportement que vous essayez de faire ou de réaliser.


0 commentaires

2
votes

Vous pouvez «rétrécir» un DIV de différentes manières différentes. Le plus facile est probablement à Affichage: Inline; Mais un flotteur se comportera comme si vous décrivez également.

Consultez http://haslayout.net/csss-Tuts/css-s-shrink- Enveloppez pour plus de détails et plus de méthodes.

Si vous souhaitez que la largeur minimale soit 200px (contradictoire à votre premier paragraphe), vous pouvez utiliser min-largeur: 200px; avec affichage: inline-block pour instance.


0 commentaires

7
votes

Le problème est que tel que

S sont des éléments de niveau de blocs, ils ne redimentent pas automatiquement pour s'adapter à leur contenu, bien que leur largeur puisse être explicitement définie. Éléments inline, tels que faisant la taille automatique pour s'adapter à leur contenu, mais ils n'acceptent pas de définir leur largeur par CSS . La solution de contournement est de rendre votre
se comporter d'une manière ou d'une autre comme une cellule de table. Voici un exemple:

CSS: xxx

html: xxx

(Notez comment nous avons dû ajouter
S avant le

s parce qu'ils ne sont plus complètement bloqués).
Voici comment cela ressemble quand rendu: l'exemple ci-dessus rendue Cela semble fonctionner sur Firefox, Chrome et IE8 (pour IE8, vous devez spécifier un DOCTYPE). J'espère que cela a aidé!

1 commentaires

Beau! Merci beaucoup! Exactement ce que je cherchais à faire.