0

我为程序的输出添加了 Web 界面，如下所示：

<body>
<table id="header" approx height is 100px, width is 50% of screen located in the middle>
...
</table>
<div id="programoutput">my program outputs stuff here using Ajax.PeriodicalUpdater</div>
</body>

我使用css作为div

#programoutput{ white-space:pre; }

并且程序的输出可能包含很长的行。所以，网页应该有水平滚动条。我想要的是确保#header 始终位于屏幕中间（而不是主体），并且主体可能会根据#programoutput 的宽度变得比视口更宽。

我几乎已经明白了，但我有一些问题：水平滚动条出现在#programoutput 本身而不是窗口中。如果输出的高度很小（如本例中的几行），则水平滚动条位于窗口的中间。

4

1 回答 1

1 
#header
{
 position:fixed;
 width:50%;
 left:25%;
}
#programoutput
{
 white-space:pre;
 overflow:visible;
}

此时您table应该被放置在视口的中心，并且您的div长度应该足以让您body生成滚动条。

但是由于tableis position:fixed，您div将“漂浮”在您的桌子上。现在你有几个选择：

1 . 给你div一个最高职位：

position:relative;
top:100px; /* you'll have to know your table's height */

2 . 将您div放在底部body（这在您的代码中似乎有效）：

position:absolute;
bottom:0px;
于 2012-08-23T03:59:23.090 回答