CSS，我的DIV的高度必须随着内容的增长而增长，但会不断增长（22px）

我有一个关于CSS的问题，我真的希望一些聪明的人能帮助我：）

所以我有一个div，里面有一些div，因为主div是内容“背景”，其他div是顶部、侧面、底部和内容本身。。当输入的文本比以前多时，我需要将边的文本展开

我以前是用白色背景做的，效果很好，但这次背景是一个图案，我希望这个图案一直保持完整。所以我希望它有一个最小高度（最小高度：22px，我试过了），当需要更多的空间时，它应该变成44，然后变成66，88，依此类推

我真的希望我足够清楚，希望有人能帮助我，因为我想得到一些启示

守则：

---

希望我足够清楚，提前谢谢

使用Javascript测量您需要的高度。然后，将这一数量的像素四舍五入到某个可以除以22的值。将此值设置为

div的高度

可以在没有javascript的情况下执行此操作，但需要您做出一些让步，并小心您的内容。看看它是如何改变高度的。它使用

行高：22px

来保持文本以这样的增量添加。这并不保证用户有可能覆盖该设置的设置，但如果没有，则应按您的意愿保留该设置

---

当然，您必须同意文本具有这样的行高，并且您必须小心让其他内容（浮动图像、填充等）保持您的大小。

容器将随着内容、周期而扩展-如果不使用一些JavaScript，无法调节它扩展的增量。不管容器的大小，背景不都是平铺的吗？如果您试图使其与顶部或底部对齐，您可以将其定位。正如Scott警告的那样，这不会优雅地降级，并且对于运行超大字体的低视力用户可能无法使用。这并不是说它降级严重。我们仍在处理背景图像，因此您“希望模式始终保持为一个整体”这一事实与“需要模式始终保持完整”这一事实大不相同。如果您能够接受某些特殊用户不会有这种体验的想法，那么我的解决方案应该可以很好地工作了。文本将以超大的尺寸分解。通过在px中指定它，它将使字体大于重叠部分，并且不可读。@MarcianoPlanque--。对于少数会出现问题的用户，您需要将

行高度

设置为

22px

的倍数，以避免出现问题。在这种情况下，我希望了解javascript。。有人能帮我进一步解决这个问题吗？如果我现在使用的是线高，那么我需要写些什么呢？谢谢你的回答。。但是我不知道如何用Javascript解决这个问题，我很乐意。。

<div id="main">
<div id="main-top"></div><!-- end of main-top-->
<div id="main-holder">
<div id="main-content">
Jejjajdijdiajsdijasidjasijdiasjd<br><br><br>hehehe

</div><!-- end of main-content-->
</div><!-- end of main-holder-->
<div id="main-bottom"></div><!-- end of main-bottom-->
</div><!-- end of main -->
--

>--
#main{
width: 999px;
padding: 0;
margin: 0 auto;
}

#main-top{
height: 22px;
width: 999px;
background: url(../images/main-top.png) no-repeat;
}

#main-holder{
background: url(../images/main-holder.png) repeat-y;
width:999px;
height: auto;
min-height:22px;
}

#main-content{
background: none;
width:auto;
margin:0 10px;
padding: 0 10px 0 10px;
overflow:hidden;
}

#main-bottom{
height:22px;
width:999px;
background: url(../images/main-bottom.png) no-repeat;
}

--