Проблема ширины CSS - PullRequest
       8

Проблема ширины CSS

0 голосов
/ 14 августа 2010

Я хотел бы создать div, ширина которого равна длине текста внутри него.Я могу сделать это без проблем, когда div находится внутри элемента DOM, ширина которого достаточна для размещения текста. Но когда я помещаю свой текстовый держатель div в другой недостаточно широкий текст, текст будет разделен на строки, даже если яустановить максимальную высоту текстового держателя div и переполнение контейнера div для видимого.

Вот мой код:

<!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>

Вот изображение этого: http://i36.tinypic.com/331ix53.png

Мне бы хотелось, чтобы текст внутри DOM-элемента "wrapper" был в ОДНОЙ строке, как текст вне него (и, конечно, был переполнен)

1 Ответ

1 голос
/ 14 августа 2010

Вы можете сделать это, добавив CSS свойство пробела в свой класс .text:

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

В действии здесь .

...