Menu
I’ve got a page which has a container for it’s main display.
One of those areas has it’s own container which is also a grid. 3 rows, 1 column.
“`
grid-row: 2/3;
grid-column: 2/3;
width: 100%;
box-sizing: border-box;
display: grid;
grid-template-columns: 100%;
grid-template-rows: 42px auto auto;
height: fit-content;
On my 3rd row. I’ve got a parent DIV. Position relative and placed in this row. Inside this I’ve got more DIV’s. I’m changing their opacity via JS and setting their position to absolute.
“`
display: block;
transition: all 0.5s ease-out;
position: absolute;
top:0;
left:0;
width: 100%;
padding: 1em;
My issue is, these DIVS have a lot of text / images and got beyond the default space created and the height doesn’t auto adjust.
Any ideas?