0

我只需要帮助使元素适合 div 的剩余空间，该空间被固定位置元素覆盖。过度简化：我有一个左固定菜单，它有 25% 的总宽度，但有一个限制：最大宽度：350 像素和最小宽度：280 像素。我还有一个中心对齐的 div，它的宽度为 80%。我想将内容放在第二个 div 中，在 div 接触点和左边距之间。我已经尝试在 div 开始和菜单结束之间放置一个间距 div （内容占用其余空间），但我得出的结论是，由于 min 和 max 无法使用 css 进行这些计算宽度。（如果我改变屏幕分辨率。宽度可能会改变或不改变）。

我怎样才能解决这个问题？它的 javascript 是个好主意吗？

4

2 回答 2

0

我认为无论是这个小提琴还是这个小提琴都可以让你得到你想要的。在任何一种情况下，我都使用了一个伪元素来生成 afloat来分隔它。

#container:before {
    content: '';
    display: block;
    float:left;
    margin-left: -12.5%; /* push float to left edge based on 80% container width */
    width: 31.25%; /* make float 25% of total width based off its 80% container */    
    max-width: 350px;
    min-width: 280px;
    height:100%; /* or 90% in first fiddle */
}

如果您希望它始终保持正确，第二个小提琴也已overflow: hidden设置。#content两者都需要height: 100%在bodyandhtml标签上设置。

于 2012-07-20T17:08:16.987 回答
-1

你可以使用这种类型的javascript

var a =$('#id of outer div').height();
var b = $('#id of inner div').height();
var c = a-b;
$('#id of filling div').css("height",c);
于 2012-07-20T15:57:18.457 回答