Home/ Questions/Q 6714827
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T08:32:27+00:00

I’m trying to put two blocks into one fixed-height block to create the following

  • 0

I’m trying to put two blocks into one fixed-height block to create the following layout:

————————

UL (initial height=0),

grows on element add until maximum height reached

scroll should be added after max height is reached

————————

DIV (initial height=100% of parent)

decreases until min height is reached

————————

HTML part of the layout:

<div style="height:100px">
  <ul style="max-height:70px;height:auto;overflow:auto"></ul>
  <div style="min-height:30px;height:auto">
    <span>TEST CONTENT</span>
  </div>
</div>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You really can’t do this cleanly with just CSS. I’d suggest using a bit of jQuery for this where you just query the height of both at any given time, figure out which is taller, and then set the other element to match

    • 0