Redimensionner dynamiquement conteneur à adapter le texte

Il existe de nombreux plugins jQuery qui vous permettent de redimensionner un texte à un conteneur. Mais comment pouvez-vous modifier dynamiquement la largeur/hauteur d'un div conteneur pour adapter le texte à l'intérieur de celui-ci?

Ci-dessous un exemple. Comme vous pouvez le voir, le texte est actuellement débordement de la div. Comment pouvez-vous en programmant redimensionner la div conteneur pour adapter le texte indépendant de la taille de la police et de contenu?

   <!DOCTYPE html>
   <html>
   <body>
   <div id="container" style="width:100px; height:100px;border:1px solid red; overflow: hidden;">
   <p style="font-size:40px;">This is the text</p>
   </div>
   </body>
   </html>
  • Inverser toutes les lignes dans un plugin qui fait le contraire, et voir si cela fonctionne ?
  • Que diriez-vous "height:auto;" ?
  • divs sont flexibles par défaut. Vous devriez être en mesure de réduire le style à la juste border:1px solid red; et la div s'étirer.
  • Mais les divs sont d'affichage type de bloc, de sorte qu'il sera de 100% de la largeur, de la hauteur de l'auto
  • J'ai remarqué que votre réponse. Vous avez raison, bien que le réglage de la largeur en pourcentage a de mieux soutenir que display: table;. caniuse.com/#search=Table%20display plus Facile et plus zen pour laisser le div être un div. :p
  • Comment se fait - % de la largeur de fixer pour vous? Aussi, mieux prendre en charge? 94% n'est pas suffisant?

InformationsquelleAutor dutchman711 | 2014-03-21