Наши проекты:
Журнал · Discuz!ML · Wiki · DRKB · Помощь проекту |
||
ПРАВИЛА | FAQ | Помощь | Поиск | Участники | Календарь | Избранное | RSS |
[18.223.172.252] |
|
Сообщ.
#1
,
|
|
|
Мне нужно сделать на сайте блок левой панели и блок контента. Пока контент - обычный текст, все нормально. Но на одной из страниц есть большая таблица, в которой нужно сделать горизонтальную прокрутку. И здесь таблица никак не хочет влзить в блок, а выходит на всю ширину влево, игнорируя все правила в CSS. Вот примерный упрощенный HTML:
<html> <head> <title>Table</title> </head> <body> <div style="width: 800px; max-width: 800px; display: table;"> <div style="width: 240px; display: table-cell;"> Lorem ipsum... (Left panel text) </div> <div style="display: table-cell;"> <div style="overflow-x: scroll;"> <table style="white-space: nowrap;"> <tr> <td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td></tr> <tr> <td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td></tr> <tr> <td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td></tr> <tr> <td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td></tr> <tr> <td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td><td>Sample text lorem ipsum</td></tr> </table> </div> </div> </div> </body> </html> Смотрю в firefox думаю в остальных браузерах то же самое. |
Сообщ.
#2
,
|
|
|
Уже нашел решение. Нужно положить рядом с display:table атрибут table-layout:fixed
|