Вопрос:

3 элемента расширяются за пределами элемента гибкого контейнера, в результате чего элементы перекрываются

html css flexbox overlapping

47 просмотра

1 ответ

42 Репутация автора

https://static.issue.life/content/img/14-07-2019/636986900625289687.png

(обновление) Я считаю, что я нашел основную причину проблемы. скажем, в контейнере есть 2 элемента div, а высота равна 300. Если я добавлю третий элемент div, высота станет равной 320. Я должен остановить изменение высоты, потому что добавлен другой элемент div. я хочу, чтобы 3-й дивизион протиснулся в 300. как мне остановить 3-й дивизион от изменения высоты контейнера?

    <div id="flex-container" style="display: flex; flex-direction: column">
           <div id=" a " style="flex-grow:1 ">
           </div>
           <div id="b " style="flex-grow: 1 ">
           </div>
           <div id="c " style="flex-grow: 1 ">
           </div>
    </div>

(оригинал) Привет. если вы посмотрите на изображение. текущая домашняя страница имеет div A и div C, показывающие, когда вы попадаете на нее. когда вы изменяете значение в выпадающем списке, b добавляется в гибкий контейнер. добавление b выталкивает C из гибкого контейнера, заставляя его перекрываться. Я не понимаю, что я делаю неправильно. Я хотел бы сохранить все 3 деления внутри контейнера Flex. пожалуйста, дайте мне обратную связь.


Автор: incognito nerd Источник Размещён: 08.01.2018 06:16

Ответы (1)


-3 плюса

8 Репутация автора

Я не уверен, что понял ваш вопрос, но постараюсь ответить на него.

Я думаю, что вы можете дать ему фиксированный размер, пожалуйста, попробуйте этот CSS:

#divId { width: 500px; height: 600px; overflow: auto }
Автор: Help Programmers Размещён: 08.01.2018 06:26
Вопросы из категории :
32x32