html - Fully compliant and semantic approach to full viewport height sections -
i'm looking construct min-height: 100% sections , seems general consensus :
html{ height: 100%; } body { min-height: 100%; }
and direct children have min-height: 100% well. problem can't wrap head around if html has fixed height 100% while body may allowed grow, hasn't shot out of page , document not semantic, i.e. html < body. also, if section wrapped in several other divs, parents require min-height: 100% well. seems little unconventional.
what elegant approach it? know height:100vh best approach if supported browsers. better use javascript obtain viewport , set interested sections' height property?
the "unconventional" issue true , conventional. see, browsers calculate "horizontal" layout, not vertical unless explicitly set. if want item have height of 100%, you'll need set height explicitly it's ancestors browser can calculate dimensions.
Comments
Post a Comment