Google Chrome 中奇怪的额外 DIV 高度
我有两个 DIV：
- 第一个很窄，向左浮动并显示一种垂直选项卡结构。
- 第二个显示左侧 DIV 中每个选定项目的内容
您可以在 JSFiddle 上看到一个简化的示例。
如示例所示，左侧 DIV 通常高于右侧 DIV。这就是为什么右侧 DIV 垂直向下移动以将其与左侧 DIV 中所选项目的底部对齐，这样当用户选择左侧的项目时，内容始终在视图中。
在 Firefox 和 IE 中一切都按预期运行，但在 Chrome 中则不然。
Chrome 问题
每当您在左侧 DIV 中选择一个应重新定位右侧 DIV 的项目时，即使所包含的 DIV 中没有一个高度相同，两个项目的整个容器也会变得更高。
这里发生了什么以及我做错了什么？
I have two DIVs:
- first one is narrow and is floated left and displays a kind of vertical tab structure.
- second one displays content per selected item in the left DIV
You can see a simplified example here on JSFiddle.
As shown in example, left DIV is usually higher than the right one. That's why the right DIV is vertically shifted down to align it to the bottom of the selected item in the left DIV so the content is always in view when a user selects an item on the left.
Everything works as expected in Firefox and IE but not in Chrome.
Chrome issue
Whenever you select an item in the left DIV that should reposition the right DIV, the whole container of both gets higher even though non of the contained DIVs is as heigh.
What seems to be going on here and what am I doing wrong?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
您可以使用
.container { Overflow-y: hide; 隐藏添加的额外高度。 }You can hide the extra height that is added by using
.container { overflow-y: hidden; }将右侧 div 容器设置为绝对位置（即左右容器的高度相同，并将宽度设置为您自己的宽度）
Set ur right side div container to position: absolute (i.e height of right and left container to be same and set width as your own)