如何使用flex调整三个div以占据屏幕的确切宽度？

Question

我有3个div并排。左边的应该占据屏幕的25％。中间的像素应固定大小，例如50像素（可能会变化）。第三个应该占据剩余空间，但不能超过屏幕的大小。当我在上面加载大图像时，它超出了屏幕。我已经尝试过pop和>>> a = [1, 2, 3, 4] >>> b = a >>> b [1, 2, 3, 4] >>> a.pop() 4 >>> b [1, 2, 3] >>> a = a[:-1] >>> b [1, 2, 3] >>> a [1, 2] ，但是两者都没有用。我希望滚动条显示在flex: 1 1 auto; div上，而不显示在flex-shrink: 1;上。

d3

body

Answer 1

第一个孩子不必flex，而只能是宽度（％）。 第二个孩子也将没有flex，并且宽度为px（因为您要固定它）。 最后，第三个孩子将拥有flex: 1，以便占用剩余的所有空间。

如果图像使第三个孩子宽于屏幕，请放置width: 100%。