перенос слов в CSS - PullRequest
Новая
       29

перенос слов в CSS

1 голос
/ 04 ноября 2010

Я пытаюсь реализовать следующий экран.

alt text

Мои HTML и CSS похожи на это ... 

<div class="label iepngfix">Nickname</div>
<div class="text">
   <?php echo $nickname; ?>
</div>

.label {
    float: left;
    font-weight: bold;
    padding: 0;
}

.text {
    float: left;
    margin: 0 0 0 5px;
    word-wrap: break-word;
}

В IE6, 7 все выглядит нормально, но в IE8, Chrome и Firefox это выглядит так ...

alt text

Что мне здесь не хватает?

Привет

Ответы [ 2 ]

3 голосов
/ 04 ноября 2010

Ваши CSS и HTML на самом деле не совпадают, но я предполагаю, что, поскольку вы не даете ширину второму плавающему элементу и он содержит длинный текст, браузер делает его максимально широким, поэтому он не будетпоместиться рядом с первым поплавком.

Или что-то, что вы нам не показываете, вызывает это.Ваша страница запускает режим стандартов (например, имеет ли он DOCTYPE)?

0 голосов
/ 05 ноября 2010

Если вы дадите div.text заданную ширину, вы получите результаты, которые вы ищете.

Пример: если вмещающий блок равен 250px, div.label, естественно, равен 90px, тогда для div.text требуется заданная ширина 155px или меньше (с учетом поля в 5px).

...