Jump to content
Sign in to follow this  
sini-maaria

100% height inside <li> element

Recommended Posts

Hi, I've been struggling with this for a while now. http://www.creamedia.fi/horisontal_slider/ Is there any possibility to get scrollbars working inside the content areas? I don't want a scrollbar for the body.Overflow is set to auto and for all the parent elements height: 100%; min-height: 100%; (including html and body). I appreciate all the help, thanks.

Share this post


Link to post
Share on other sites

You will find that part of the problem stems from adding margin and padding to elements that already have 100% height. Padding and margins are added in addition to the element's height.Another thing you should change is the min-height declarations. There is no purpose in setting min-height when the height is already set. min-height and max-height are only good on elements that may vary in height. You should also remove any "width: 100%" declarations because elements naturally are 100% wide with the additional advantage that margin and padding are actually accounted for. Anyways, getting straight to the very root of the problem: You forgot a "height: 100%" property on the <ul> element.

Share this post


Link to post
Share on other sites

Thank you! All those things I actually knew but somewhere in the middle I think I got confused when I tried every little thing that different people told in different forums. :) But adding 100% to ul was the answer. :) Thanks again!

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...