Nic727 Posted June 7, 2018 Share Posted June 7, 2018 Hi, For my homepage I need html and body to be 100% of height. The reason is that I have a background slider which is 100% height and without body/html 100% height, it become 0 and background image doesn't show up. The problem is that on other pages, elements (images and texts) are out of body/html since they only take 100% of browser height. Can I use class to html tag or not? I tried with height auto and 100% to body only, but doesn't work for my homepage. One of the solution is to put height 100vh to my slider, but I know that 100vh is a bit buggy on Safari (IOS) since it doesn't take the bottom bar into consideration… Is there any way to get a true 100% height of my slider without html/body to be 100% too? Thank you Link to comment Share on other sites More sharing options...
dsonesuk Posted June 7, 2018 Share Posted June 7, 2018 If you use a wrapper element that will fit whole width and height of the body place slider and content from other pages in that and use min-height: 100%; along with body, html {height: 100%} the slideshow should fit 100% height as a minimum, it then should adjust to accommodate content that extends beyond body/html 100% height. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now