标题已修复但对内容有响应

Question

示例问题： http://jsfiddle.net/yrbvw473/43/

我只想从顶部获得保证金内容是平衡。如果在小宽度浏览器中，标题将有两行行，如果这样我希望内容从顶部变得更远。如果三个标题有3行，那么遥远的顶部和内容会得到更多...

我的代码是css：

    @media (max-width: 990px) {
    .heads_search{
        top:40px;
    }
    #space_top{
        height:50px;
    }
}
@media (max-width: 767px) {
    .heads_search{
        top:60px;
    }
    #space_top{
        height:160px;
    }
}
@media (max-width: 390px) {
    .heads_search{
        top:100px;
    }
    #space_top{
        height:200px;
    }
}

但它没有100％正确，所以如果有人有更好的主意吗？

Answer 1

添加一个小脚本来调整margin-top属性。尝试这样的事情。

$( window ).resize(function() {
  $('#content').css('margin-top', 50 + $('#header').height());
});