Open ghost opened 12 years ago
Are there any plans to introduce mixed vertical and horizontal layouts, i.e.: fixed nav-fluid content-fixed banners or fixed header-fluid items-fixed footer
Here's my shot at it in LESS:
.hxfx-123 ( @leftWidth, @rightWidth, @leftGutter: 0px, @rightGutter: 0px, @centerHasPadding: 0px) { padding-left: @leftWidth + @leftGutter; padding-right: @rightWidth + @rightGutter + 2 * @centerHasPadding; .lc { width: @leftWidth; margin-left: -@leftWidth - @leftGutter; float: left; } .cc { width: 100%; float: left; } .rc { width: @rightWidth; margin-right: -@rightWidth - @rightGutter - 2 * @centerHasPadding; float: right; } }
.vxfx-123 ( @firstHeight, @thirdHeight, @secondOverflow: hidden) { position: relative; .fr { height: @firstHeight; } .sr { position: absolute; top: @firstHeight; bottom: @thirdHeight; left: 0; right: 0; overflow: @secondOverflow; } .tr { height: @thirdHeight; position: absolute; bottom: 0; left: 0; right: 0; } }
Are there any plans to introduce mixed vertical and horizontal layouts, i.e.: fixed nav-fluid content-fixed banners or fixed header-fluid items-fixed footer
Here's my shot at it in LESS:
.hxfx-123 ( @leftWidth, @rightWidth, @leftGutter: 0px, @rightGutter: 0px, @centerHasPadding: 0px) { padding-left: @leftWidth + @leftGutter; padding-right: @rightWidth + @rightGutter + 2 * @centerHasPadding; .lc { width: @leftWidth; margin-left: -@leftWidth - @leftGutter; float: left; } .cc { width: 100%; float: left; } .rc { width: @rightWidth; margin-right: -@rightWidth - @rightGutter - 2 * @centerHasPadding; float: right; } }
.vxfx-123 ( @firstHeight, @thirdHeight, @secondOverflow: hidden) { position: relative; .fr { height: @firstHeight; } .sr { position: absolute; top: @firstHeight; bottom: @thirdHeight; left: 0; right: 0; overflow: @secondOverflow; } .tr { height: @thirdHeight; position: absolute; bottom: 0; left: 0; right: 0; } }