0

I have a blog with some content in it (divs). When i click a div a lightbox-like article appears. It has a transparent black container and on the middle an article. The container has position absolute , width and height auto top 0 and z-index over all content beneath Its all ok until i resize the window. The the content of the body, the one underneath the article, goes beneath it. i want to make the container resize and stretch to cover that content too. And also to be able to scroll. Help please.

Razvan Pop
  • 198
  • 9

1 Answers1

0

You can set the height and width of the box using vh and vw units which are set in terms of the height and width of the window. http://www.w3schools.com/cssref/css_units.asp

Joshua Smith
  • 6,561
  • 1
  • 30
  • 28
  • That would make it 100% of the viewport height. Not the body height, which in this case is not fixed – Razvan Pop Nov 09 '16 at 15:36
  • it would only make it 100% of the viewport height if you used 100vh it would help me give a better answer if you showed your code. – Joshua Smith Nov 09 '16 at 15:38
  • Looking at this, I'm not sure what problem you are trying to solve. On chrome, the modal div always covers the content even on window resize. – Joshua Smith Nov 09 '16 at 15:43
  • Resize it horizontally. – Razvan Pop Nov 09 '16 at 15:50
  • Horizontal size specified in `%` or `vw` will work. For scrolling, you'll likely need to use javascript like this question http://stackoverflow.com/questions/2996431/detect-when-a-window-is-resized-using-javascript – Joshua Smith Nov 09 '16 at 15:54