gpt4 book ai didi

html - 使 flex 元素的内容滚动而不是使容器更高

转载 作者:行者123 更新时间:2023-11-28 19:20:19 24 4
gpt4 key购买 nike

<分区>

我有一个对话框:

$(document).ready(function() {
$('.ui.modal').modal('show');
});
        .content {
display: flex !important;
flex-direction: column;
}

.ui.modal > .content > .scroll {
flex: 1;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/fomantic-ui@2.7.6/dist/semantic.min.css" rel="stylesheet"/>
<script src="https://cdn.jsdelivr.net/npm/fomantic-ui@2.7.6/dist/semantic.min.js"></script>


<div class="ui overlay fullscreen modal">
<div class="header">
Dialog box
</div>
<div class="content">
<div class="ui warning message">
<div class="header">
Be careful
</div>
This is a warning message
</div>
<div class="scroll ui segment">This box should scroll when the contents are too long.</div>
<div class="ui segment">Part of the dialog box</div>
</div>
<div class="actions">
<div class="ui approve button">Save</div>
<div class="ui cancel button">Cancel</div>
</div>
</div>

目前,如果大框(表示应该滚动的那个)的内容太长,那么它会使整个对话框滚动。我不想要这个,我希望框的内容滚动而不使整个窗口滚动,如下所示:

scroll dialog box

我该怎么做?

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com