2014-11-21 2 views
0

Я попробовал дисплей: table-cell, но он не сработал. Как я могу показать слово внутри div. Теперь он показывает переполнение div. Я использую CSS2 на своей веб-странице. Заранее спасибо.текст за пределами блока

<div style=" width:60px; border-style: solid; border-width: 15px; display: block;"> 
 
    <a href="http://www.w3schools.com" target="_blank">Visit W3Schoolseeeeee </a> 
 
</div> 
 
<div style="float: right; border-color: #ff33ff" width:50%;>Column 2</div> 
 

+0

Сделайте шрифт меньше или коробку больше. –

+0

Итак, вы хотите, чтобы текст переполнения скрывался, поле для роста или текст для обертывания? – mattytommo

+1

Вы просто спрашиваете, как сделать текст подходящим в коробке, которую вы намеренно установили слишком узко для этого? –

ответ

0

Используйте слово-обертывание:

a{ 
word-wrap: break-word; 
} 

demo

+0

Это всегда справка, чтобы помочь вам. Лечение хуже, чем болезнь. –

+3

Но это именно то, о чем он просит. –

0

Изменение ширины контейнера сНу, чтобы содержание, чтобы соответствовать. Прямо сейчас у вас установлено 60 пикселей, что недостаточно широко, чтобы текст отображался без переполнения. Вы могли бы сделать что-то вроде этого, вместо:

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <style> 
 
    </style> 
 
</head> 
 
<body> 
 

 

 
    <div style="width:150px; border-style: solid; 
 
border-width: 15px; display: block; text-align: center;"> 
 
     <a href="http://www.w3schools.com" target="_blank">Visit W3Schoolseeeeee </a> 
 
    </div> 
 
    <div style="float: right; border-color: #ff33ff" width:50%;>Column 2</div> 
 

 

 
</body> 
 
</html>

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

Смежные вопросы