Div宽度100%减去固定的像素数量 - Div width 100% minus fixed amount of pixels

问题:

How can I achieve the following structure without using tables or JavaScript? 如何在不使用表或JavaScript的情况下实现以下结构? The white borders represent edges of divs and aren't relevant to the question. 白色边框代表div的边缘,与问题无关。

结构1

The size of the area in the middle is going to vary, but it will have exact pixel values and the whole structure should scale according to those values. 中间区域的大小将会变化,但它将具有精确的像素值,整个结构应根据这些值进行缩放。 To simplify it, I'd need a way to set "100% - n px" width to the top-middle and bottom-middle divs. 为了简化它,我需要一种方法将“100% - n px”宽度设置为顶部中间和底部中间div。

I'd appreciate a clean cross-browser solution, but in case it's not possible, CSS hacks will do. 我很欣赏一个干净的跨浏览器解决方案,但万一不可能,CSS黑客会这样做。

Here's a bonus. 这是奖金。 Another structure I've been struggling with and end up using tables or JavaScript. 我一直在努力的另一个结构,并最终使用表或JavaScript。 It's slightly different, but introduces new problems. 它略有不同,但引入了新的问题。 I've been mainly using it in jQuery-based windowing system, but I'd like to keep the layout out of the script and only control the size of one element (the middle one). 我一直主要在基于jQuery的窗口系统中使用它,但我想保持布局不受脚本限制,只能控制一个元素(中间元素)的大小。

结构2


解决方案:

参考一: https://stackoom.com/question/2jR7
参考二: Div width 100% minus fixed amount of pixels
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章