我有问题在设计布局css与div元素。
基本上,我的主页面布局设计如下图所示:
红色框是浏览器屏幕区域。黑框是包含/或通过ajax加载数据的内容区域。绿色的方框是数据列表,它是响应结果,其中包含大约100行。数据列表包含标题div和行div。
我打算做的是在蓝色区域设置溢出,这是数据行,因此滚动条将出现在蓝色框的右侧,而不是红色或黑色框的右侧。然后,当浏览器区域(红色)调整大小时,里面的所有div也会调整到最佳大小。
通过设置css overflow : auto /scroll for blue box div,我已经设法使滚动条出现在蓝色框中,当里面的数据溢出时。但问题是溢出:
我正在尝试为我的网站设置一个适合屏幕的应用程序,但我遇到了一些问题,我知道CSS在基本方面的细节,但我在使用百分比时有点困惑。
我需要一个标题(50px),然后我需要一个框(高度100%)然后是一个小框脚(20px),但这一切都需要在屏幕上没有溢出,当我尝试与给定的代码时,我得到一个溢出,因为100%的项目推下页脚导致溢出滚动条。
<div id="holder"> <-- this is set to 100% width & height as well as html, body
<div id="header"
首先,看一下这个:
HTML:
<div id="container">
<div id="tooWide">
<p>This is just way too wide! We should clip it.</p>
</div>
<div id="relativeParent">
<div id="absoluteChild">
<p>text</p
这是关于拖动比其父元素更宽的元素(溢出:隐藏)。父级的宽度和溢出选项是固定的,无法更改。
HTML
<div class="container">
<p class="text">The quick brown fox jumps over the lazy dog.</p>
</div>
CSS
.container {
position:relative;
width:300px;
height:50px;
background:#ccc;
overflow:hidden; // be
我有一列元素,每个元素都在前一个元素的下方。我的代码的简化版本如下所示:
<div style="position: relative; height: 100%;">
<div style="position: absolute;">Really long text here</div>
<div style="position: absolute;">Not so long text here</div>
</div>
基本上,我的问题是,在较小的屏幕尺寸上,
我发现了关于堆栈溢出的出色性能的。这上面写着
Stack Overflow still uses a scale-up strategy. No clouds in site. With their SQL Servers loaded with 384 GB of RAM and 2TB of SSD, AWS would cost a fortune. The cloud would also slow them down, making it harder to optimize and troubleshoot system issues. Plus, SO doesn’t need
我有一个Card div,如果内容超过它的高度,就应该显示它。我用过overflow-y: auto来做这件事。我试图在它里面使用一个Select,选择菜单应该显示在卡片的前面。菜单位置是absolute。
问题是,即使使用position: absolute,菜单也会占用卡内的空间。让它可以滚动。
如果我从卡中删除溢出,它可以正常工作,但内容超过它。我为它创建了一个沙箱:
其他我试过的事情
在门户中显示SelectMenu。
- Better results I got so far, but when the window is scrolled, the menu