Jump to content
  • 0

Прокруткав ширину, и див такой же


Лёха
 Share

Question

Вот возможно ли так сделать:

e6bPUd3Y.png

Заголовки типа Kitchen, LivingRoom

И в них должно быть то что черными символами (эти блоки у меня будут разных размеров, неизвестная высота).

Т.е. что я хочу спросить, как запретить вертикальное растягивание, а оставить горизонтальное заполнение?

Т.е. вот так:

1 | 4 | 7

2 | 5 | 8

3 | 6 | n

Ну и есно что бы часть могла быть скрытая, по ней скрол просто уже сделать.

Такое возможно на HTML CSS ?

Edited by Лёха
Link to comment
Share on other sites

6 answers to this question

Recommended Posts

  • 0

В общем сделал прокрутку вертикально.

Как ни пытался объяснить, не получилось :)

Ну В общем на фото - высота серого квадрата - фиксирована.

А данные (черные блоки) добавляются как показано на стрелке. Причем данные находятся в одном диве, а не в нескольких

KcVRG632.png

Link to comment
Share on other sites

  • 0

Всё очень просто. за это отвечает свойство overflow.

Горизонтальная прокрутка не будет появляться автоматически. Чтобы её спровоцировать необходимо вставить внутрь див достаточной для размещения внутреннего контента ширины или, что имхо, в контексте вопроса, луче табличку.

Если необходимо сделать не оригинальную системную крутилку то системная прокрутка полностью отключается а вместо неё добавляется объект контролируемый через js.

<div style="height:150px; width:150px;overflow: auto;"><div style="width:100500px;">так например</div></div>

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy