html中width影响排版问题

三个div标记，其中中间的定义了宽度高度是百分之百，然后居中宽度600px，这左边的图片和右边都是宽度和高度百分之百应用了浮动，为啥不顶上去，然后中间div留下的位置，左右图片都补上，为啥不会这样

首先，浮动元素是否顶上去，取决于其父元素的清除浮动性。如果父元素没有清除浮动，那么子元素的边框和内容可能会被浮动的子元素“撑开”，导致出现意外的布局效果。所以，您需要确保父元素对浮动进行清除。

其次，中间的div宽度高度设置为百分之百，并且居中，这意味着它将占据其父元素的全部宽度和高度，而不是顶部的容器元素。因此，它不会像您期望的那样留出左右图片应该占据的空间。相反，它将填充其父元素的所有可用空间。

为了解决这个问题，您可以将中间的div设置为flex容器，并使用justify-content和align-items属性来居中内容。这将确保它在父元素中正确地居中，并且不会与左右图片产生重叠。

直接用flex布局就可以了