如何保持内联 2 个具有最小宽度的固定元素？

Question

有 2 个固定的（无法更改）内联块和它们的最小宽度。当我尝试调整 window 的大小时（宽度小于最小值），它们相互重叠。有什么建议吗？如何设置整个页面的最小宽度？

<div style="position:fixed;left:0;top:0;bottom:0;width:40%;min-width:500px;border:2px solid red;margin:5px;">&nbsp;</div>
<div style="position:fixed;right:0;top:0;bottom:0;width:40%;min-width:500px;border:2px solid blue;margin:5px;">&nbsp;</div>

Answer 1

简短的回答是否，并非没有改变position: fixed

看看 position: fixed 的实际含义：

fixed
Do not leave space for the element. Instead, position it at a specified position relative to the screen's viewport and don't move it when scrolled. When printing, position it at that fixed position on every page.

https://developer.mozilla.org/en-US/docs/Web/CSS/position

并且由于您无法控制视口的宽度...

绝对位置应该可以，然后您可以将 body 设置为如下所示：

body {
    min-width: 1020px;
    position: relative;
    min-height: 100%;
}
html{
  height: 100%;
}

http://jsfiddle.net/1forkath/

如何保持内联 2 个具有最小宽度的固定元素？

How to keep inline 2 fixed elements having min-width?

css

css-position