【问题标题】:CSS layout help - fluid vertically and absoluteCSS 布局帮助 - 垂直和绝对流畅
【发布时间】:2012-10-17 02:30:16
【问题描述】:

我有一个评论系统我想浮动到我的页面右侧,绝对定位:

我希望盒子有最大数量的 cmets,因为我限制了字符,所以不要太在意高度

但我希望 cmets 字段根据其中的文本垂直扩展:

所以,外壳是 200px 宽 - 那么每一行是 200px 宽,50px 浮动左 div 用于用户图片,150px 浮动右 div 用于评论(评论 div 必须垂直扩展 - 不能真正将最小高度作为一个词答案将是最大 16 像素)

这可能吗?目前我正在尝试使用 overflow:auto 设置评论 div 的最小高度,但这只会导致滚动条,如果我能提供帮助,我绝对不想要它

【问题讨论】:

  • 我不明白问题出在哪里。 <div> 的默认行为是在里面有很多内容时垂直展开。
  • 如果您不想要滚动条,请将溢出设置为隐藏。我们不确定您还有什么问题。

标签: css css-position fluid-layout


【解决方案1】:

问题很可能(没有提供代码,我无法确认)您的绝对定位的 div 什么都没有。这导致 div 尝试占用最小的空间,因此滚动条。

这通常发生在您将某些东西以绝对方式定位在一个已经以绝对方式定位的元素中时。绝对项从父上下文中取出,因此父容器不会占用内部内容的空间。因此,绝对元素中只有一个元素也在绝对元素中的行为就像它是空的一样。

I've made this little demo

看看当你改变这一行时会发生什么:

.comment {position:relative;border:1px solid yellow;padding:3px; margin;3px;}

到这个:

.comment {position:absolute;border:1px solid yellow;padding:3px; margin;3px;}

Bam,滚动条。

【讨论】:

    猜你喜欢
    • 2014-07-03
    • 2010-09-23
    • 2018-07-28
    • 1970-01-01
    • 2013-05-25
    • 1970-01-01
    • 1970-01-01
    • 2012-12-30
    • 1970-01-01
    相关资源
    最近更新 更多