Link to home
Start Free TrialLog in
Avatar of goldsmithwilliams
goldsmithwilliamsFlag for United Kingdom of Great Britain and Northern Ireland

asked on

Percentage Scrolling In Browser

Hello All,

I have the following html code in my page. Now this works great for 100% height on my page.

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Blurb</title>
<style>
<!--

html,body {
      margin: 0;
      padding: 0;
}

div {
      border: 10px solid #000000;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
}

div#test {
      height: 100%;
}

div#nested {
      height: 50%;
}

div#nested2 {
      height: 50%; sc
}

-->
</style>

</head>

<body>

<div id="test">
      <div id="nested">
                 Nested div with height: 50%
      </div>
  <div id="nested2">
      Main div with height: 50%
  </div>
</div>
</body>
</html>

Now the problem I need to solve is that i need to be able to store unlimited data in the second div (nested2) but i don't want this to stretch outside of the browser window. Instead I want the second div (nested2) to scroll within it's 50% boundaries.

Sorry if that makes no sense. The long term goal is to create a popup with concrete data on the first div and a dataset on the second div that will contain dynamic data that will forever change.

Please Help.

Thanks
ASKER CERTIFIED SOLUTION
Avatar of MrRio
MrRio
Flag of United Kingdom of Great Britain and Northern Ireland image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial