我需要以下布局,包含左、内容和右三列。
左边和右边的内容只是在其中有一个图像,而左边的 col. 图片需要留在浏览器的左边,右边的col。图像位于浏览器的右侧,因此当调整浏览器宽度时,两列都保持在其边缘。
其中内容/中心列需要固定为 960 像素,并且还保持在屏幕中间。
因此,在调整浏览器宽度时,内容会停留在中间,但是当浏览器宽度减小时,左右两列都不会越过主要内容,而是停留在两侧。
我已经尝试了多次,但目前取得了很大的成功,任何帮助将不胜感激。
谢谢你
更新:
根据要求,我添加了一个我尝试过的jsfiddle :
我达到了我想要的 99%,但内容保持居中,右侧保持在右侧,但理想情况下,我希望内容和面板保持居中。
目前,如果缩小左列并且部分内容是可见的,但我希望在窗口中/居中查看内容,以便左列移到屏幕左侧。谢谢希望链接有帮助。
一些细节:侧列的最小宽度应为 280,内容部分宽度为 960,因此外部容器最小 1520。