Question

我正在开发一个网站，其中禁用访问是主要要求之一。为此，我实现了一个很好的Javascript字体大小增加/减少功能。

但是，调整大小的文本所在的div元素会根据文本大小更改高度，而其他所有内容都保持不变。宽度不会更改，但高度属性设置为100％没有任何区别。为了保持高度固定，需要对CSS进行哪些更改？所以页脚内容以及内容元素背景保持不变？

这是容器元素，其中所有其他div都嵌套在其中：

#container{
  width:1000px;
  height:100%;
  background-color:#FEFFF1;
  margin: 0 auto;
  margin-top:5px;
  text-align: left;
  font-size:1.4em;  
  border: 1px dotted black;
  overflow:scroll;
}

这是内容元素，其中包含页面唯一内容：

#content{
  float:left;
  margin-top: 223px;
  margin-left:250px;
  height:100%;
  width: 70%;
  overflow:auto;
  padding-bottom:120px;
  position:relative;
}

编辑更改了容器溢出值以进行滚动，它应该是最初的位置。

Answer 1

如果您不允许包含文本的容器随文本一起展开，那么让人们调整文本大小的重点是什么？

请注意，对于“已禁用”的人来说，文字大小不是问题。这对每个人都是一个问题。从好的方面来说，我们终于可以将浏览器添加为比以往更加实用和可查找的功能。因此，编写自己的基于JS的文本大小调整小部件并不像以前那样大。

要回答您的具体问题，CSS中的height指的是页面的高度（在外层）或嵌套在其中的任何容器。如果内容溢出，它将超过所述高度，除非你提供SCROLL或HIDDEN的溢出值，这再次违背了字体大小调整的目的。您最好的办法是确保您的页面设计/布局可以处理可变的字体大小。

Answer 2

只需指定固定高度而不是百分比。如在

如何保持文本调整大小不影响div高度？

2 个答案: