0

Как реализовать прокрутку при div width = 100%; ?
При установке ширины блока в пикселях все отлично работает.

<div style="width:100%; overflow-x: scroll;">
  <table width="100000px;">
    <tr><td style="background:#f00">&nbsp;</td></tr>
  </table>
</div>

1
  • 1
    И в чем вопрос? У блока width:100% и прокрутка есть. Commented 28 мар. 2017 в 9:07

2 ответа 2

2

Добавьте вашей табличке высоту:

<div style="width:100%; overflow-x: scroll;">
<table width="100000px;" height="20px;">
...
</table>
</div>

4
  • Не помогает - тут работает, так как тут внешняя ширина задана в пикселях!
    – user241653
    Commented 27 мар. 2017 в 15:50
  • @user241653 я ничего не менял в вашем примере, просто добавил height="20px;"
    – Crantisz
    Commented 27 мар. 2017 в 15:56
  • Так оно из без высоты прекрасно работало
    – vp_arth
    Commented 28 мар. 2017 в 10:03
  • @vp_arth посмотрите историю правок
    – Crantisz
    Commented 28 мар. 2017 в 10:06
0

Вам нужно, чтобы таблица была минимум на ширину страницы? Тогда используйте следующий код:

<div style="width:100%; overflow-x: auto;">
  <table style="min-width:100%;">
    <tr><td style="background:#f00">&nbsp;</td></tr>
  </table>
</div>

Если вы хотите задать ячейкам ширину, превышающую текущую ширину таблицы (чтобы растянуть ее), то либо измените их стиль display, либо добавьте внутрь ячеек блочный элемент с указанной шириной.

<div style="width:100%; overflow-x: auto;">
  <table style="min-width:100%;">
    <tr><td style="background:#f00"><div style="width:1000px">&nbsp;</div></td></tr>
  </table>
</div>

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.