Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > верстка divов

Автор: XaverOz 28.7.2011, 13:11

Есть таблица в которой хранится рисунок, и название(4-35 символов). Хотелось бы сделать так что бы каждая запись отображалась в отдельном элементе, и что бы элемент название у которого больше определенного числа символов "рос" вниз, а не вширь. Написал для этого следующий код:

Код


div.bl {
border: 4px ridge #5d5ae;
background: #5d5ae;
width: 100px;
margin-top: 15px;
margin-bottom: 15px;
margin-left: 15px;
text-align: center;
padding-bottom: 5px;
}

div.bl img {
margin-top: 5px;
margin-bottom: 5px;
}

div.bl span {
word-wrap: break-word;
}

Код


<table border=1>        
    <tr>        
        <td>
            <div class="bl" id="bl_1" onclick="alert(1);">
                <img src="/data/1.bmp" align=middle>
                <br>
                <span>
                    AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
                </span>
            </div>
        </td>
        <td>
            <div class="bl" id="bl_2" onclick="alert(1);">
                <img src="/data/1.bmp" align=middle>
                <br>
                <span>
                    AAAAA
                </span>
            </div>
        </td>
    </tr>
</table>

В ie6 word-wrap: break-word; не влияет на ширину первой ячейки (не divа), установка ширины ячейки в css так же не помогло.

Автор: 0Scrum 28.7.2011, 13:59

Код


div.bl  {
word-wrap: break-word;
}

Ток табличка все равно увеличивается от 6-8 ИЕ, я бы отказался от таблички.

Забыл про замечательное свойство table-layout

Код


table {
  table-layout: fixed;
  border-collapse: collapse;
  width: 206px;
  padding: 0;
}

Поэкспериментируйте, возможно вам повезет smile

Автор: XaverOz 29.7.2011, 05:50

Спасибо помогло

Автор: graylys 29.7.2011, 13:19

Как отцентрировать сайт? Если прописать в стили margin: 0 auto не получаеться
Маргин лефт райт тоже по нулям..
Если писать <center>
</center>
то меню получаеться в центре экрана

Автор: SelenIT 31.7.2011, 18:30

Цитата

Если прописать в стили margin: 0 auto не получаеться

При нормальном доктайпе (хотя бы минимальном <!DOCTYPE html>) и явно указанной ширине всё должно получиться.

Цитата(graylys @ 29.7.2011, 13:19

)

меню получаеться в центре экрана

А где должно быть?

На будущее — лучше новый вопрос задавать в отдельной теме, а не лезть в чужую;)