Home/ Questions/Q 991137
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-16T06:03:35+00:00

I’d like to create a div that has the same width as the text’s

  • 0

I’d like to create a div that has the same width as the text’s length inside it.
I can do it without problem when the div is inside a DOM element that has enough width to fit the text in.
But when I put my text holder div inside another div that is not wide enough the text will be fractioned into lines even if I set the text holder div’s max height and the container div’s overflow to visible.

Here is my code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

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

 <style type="text/css">
   body{
    background: #c0c0c0;
   }

   #wrapper{
    margin: auto;
    width: 200px;
    height: 300px;
    border: 1px solid yellow;
    overflow: visible;
   }

    .text{
     display: inline;
     min-width: 200px;
     max-height: 19px;
     line-height: 19px;
     font-size: 19px;
     background: red;
    } 
 </style>
  </head>

  <body>
  <div id="wrapper">
   <div class="text"> dugasu dauisghdu iasgudgu asgduig ausdgui gasuidg iasugdui asd</div>
  </div>

  <div class="text"> dugasu dauisghdu iasgudgu asgduig ausdgui gasuidg iasugdui asd</div>
  </body>
</html>

Here’s a picture of that:
http://i36.tinypic.com/331ix53.png

I’d like the text inside the “wrapper” DOM element to be in ONE line like the text outside it (and of course to be overflowed)

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You can do this by adding the CSS white-space property to your .text class:

    .text{
     white-space: nowrap;
     /* other css declarations */
}

    In action here.

    • 0