我一直在试图让侧边栏固定在中心 div 上，我让它主要在 Firefox 和 IE 中工作，但由于某种原因它在 Chrome 中不起作用。我的问题是，当我调整窗口大小时，左侧边栏不再延伸到 chrome 页面的底部。所有代码都包含在下面，因此您可以在自己的浏览器中看到我所看到的内容。
我的问题是:为什么 Chrome 会这样，我有办法解决这个问题吗？我的 Chrome 版本是 28.0.1500.95。
谢谢。
HTML:
<html>
<header>
<link rel="stylesheet" href="test.css"/>
</header>
<body style="margin:0">
<div>
<div class="width main table">
<div class="relative-float-left" style=" width:0px; height: inherit; ">
<div class="relative-float-left sidebar table">
--Some lorem ipsum here--
<br style="clear: both; " />
</div>
</div>
<div class="relative-float-left content">
--Some lorem ipsum here--
</div>
<br style="clear: both; " />
</div>
</div>
</body>
CSS:
.relative-float-left {position:relative; float:left;}
.width {width:33%;}
.table {display:table;height:100%;}
.sidebar {width:30px;right:45px;background-color:yellow;}
.content {margin-left: 10px; width: 95%; background-color: orange;}
.main {background-color:blue; width:50%; margin:auto;}
编辑:我希望中心 div 能够随着边栏的固定而动态调整大小。侧边栏内的内容无法被裁剪，我希望将任何无法放入页面的内容向下推并使页面变大(因此我不想对内容(橙色)div 使用内部滚动。抱歉对于凌乱的代码，更容易测试概念验证。
我还重写了代码，为它提供了一个样式表，以便于阅读。我真的很想回答这个问题，因为我不知道为什么会这样。可能跟这个有关系answer.
最佳答案
你有 <header>在您的来源中而不是 <head> .这会导致文档无效，而不是因为您不能在该位置设置标题 - 浏览器会自动插入 <body>。在那里开始标记，然后将标题放入其中 - 但因为有一个 <link>其中应该在头部，而不是在 body 中。然后有一个 <body>主体已经打开时开始标记，这也是不允许的。
编辑:我看到您现在编辑了您的评论，这是否意味着您不再认为这是问题的原因？
关于html - 显示 :table 的 Chrome 问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18412187/