gpt4 book ai didi

javascript - 流体元素和溢出问题

转载 作者:行者123 更新时间:2023-11-28 15:03:48 25 4
gpt4 key购买 nike

这是我碰到的一个树桩。

我正在设计一个……东西。它根据浏览器窗口调整自身大小,顶部有一些控件,底部附近有一个相当大的列表。无论如何,它基本上是一个随浏览器窗口调整大小的表格单元格,其大小是文档大小 - 高度为 130 像素,文档大小 - 宽度为 50 像素。我想要它做的是,当该单元格内的内容列表大于单元格时,它会使用 css 的 overflow: auto 变得滚动。

问题是,我无法做到这一点,只能使整个文档滚动。目前,该单元格除了 valign:top 之外没有其他属性,它只有一个 div(列表元素写入其中),并且设置为 overflow:auto。但是,当列表变长时,它只会放大整个文档。

我不想给它一个静态大小,因为它随页面调整大小。

有什么想法吗?

谢谢!-戴夫

最佳答案

我不确定我是否理解正确,但这里的尝试可能会给您一些想法。

<head>
<title>Test</title>
<style>
div.outer {
background-color: red;
position: absolute;
top: 40px;
bottom: 40px;
left: 40px;
right: 40px;
}
div.inner {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
overflow: auto;
background-color: aqua;
}
</style>
</head>

<body>

<div class="outer">
<div class="inner">
On the Insert tab, the galleries include items that are designed to coordinate with the overall look of your document. You can use these galleries to insert tables, headers, footers, lists, cover pages, and other document building blocks. When you create pictures, charts, or diagrams, they also coordinate with your current document look.
You can easily change the formatting of selected text in the document text by choosing a look for the selected text from the Quick Styles gallery on the Home tab. You can also format text directly by using the other controls on the Home tab. Most controls offer a choice of using the look from the current theme or using a format that you specify directly.
To change the overall look of your document, choose new Theme elements on the Page Layout tab. To change the looks available in the Quick Style gallery, use the Change Current Quick Style Set command. Both the Themes gallery and the Quick Styles gallery provide reset commands so that you can always restore the look of your document to the original contained in your current template.
</div>
</div>

</body>

关于javascript - 流体元素和溢出问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/723023/

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