【问题标题】:Auto Resizing Different Row Divs自动调整不同行 div 的大小
【发布时间】:2013-03-07 04:09:17
【问题描述】:

好的,我在不同的页面上有两行相同的类 div。在第 1 页上,有一行包含大量文本,并且它的大小设置效果很好。在第 2 页,div“框”中的文字少了很多,但尺寸太大了。

我想要完成的是让第 1 页上的 3 个 div 具有正确的当前高度设置,但我希望第 2 页上的 div 具有更短的高度设置。唯一的问题是这必须在一个 Css 类(父级和兄弟级)中完成。

这是一个例子的图片:

2a:这是当前的高度设置,它可以完美地处理大量文本。

2b:较短的文本框太长,需要缩短但仍与 2a 属于同一类。

2c & 2d:正确的自动调整高度

.box{
    height: 400px;
}

.box .box_content{
    height: 90%;
}

【问题讨论】:

  • 你可以不只是从css中删除高度并且div会根据其内容自动调整大小吗?
  • 我需要 div 相等:以便 div 的底部和顶部水平对齐。

标签: css html height


【解决方案1】:

如果您删除 .box 上的高度设置,高度将动态填充内容。

如果每行需要相等的高度,您可以使用 jquery 找到该行中最高的 div 并相应地设置其他。

【讨论】:

  • 这可能行得通,不过还是先用 CSS 做吧?
  • 行内是否可以有不同的内容高度?
  • 不,它们需要相等,只是根据其中的内容进行调整,以便每行更小/更大。
  • 不,我的问题是行中的每一列可以有不同的内容高度吗?我知道行需要相等。
  • 使用相同的 CSS 类,你需要一个 javascript 解决方案来解决这个问题
猜你喜欢
  • 2015-03-13
  • 2015-07-28
  • 1970-01-01
  • 1970-01-01
  • 2014-06-20
  • 1970-01-01
  • 1970-01-01
  • 2015-05-19
  • 2015-02-13
相关资源
最近更新 更多