# \[8.1.25\] Tall containers in scrollable parent container do not render borders for entire height

**URL:** <https://forum.inductiveautomation.com/t/8-1-25-tall-containers-in-scrollable-parent-container-do-not-render-borders-for-entire-height/86457>\
**Category:** Ignition\
**Tags:** ignition81, perspective\
**Created:** [February 27, 2024, 8:23pm UTC](https://forum.inductiveautomation.com/t/8-1-25-tall-containers-in-scrollable-parent-container-do-not-render-borders-for-entire-height/86457 "2024-02-27T20:23:46Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![ryan.white](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/ryan.white/32/73193_2.png) [@ryan.white](https://forum.inductiveautomation.com/u/ryan.white)\
**Post date:** [February 27, 2024, 8:23pm UTC](https://forum.inductiveautomation.com/t/8-1-25-tall-containers-in-scrollable-parent-container-do-not-render-borders-for-entire-height/86457/1 "2024-02-27T20:23:46Z")

</div>

I have 2 flex column containers side by side inside a flex row container. The two column containers are tall, and require vertical scrolling to be able to access all the information on them.

I have set a border on the right side of the left inner container, but it only renders the border for the height of the viewport at launch, and scrolling down in the container at runtime reveals the border does not render for the full length of the container height.

> **View at launch**
>
> ![borderissue0](https://us1.discourse-cdn.com/inductiveautomation/original/3X/4/f/4f4997ae0902e15e26a1916db384697edae68513.png)

> **View after scrolling**
>
> ![borderissue1](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/c/0c88528545de849143c85477a16c25e90d33cb49.png)

> **Parent Container Config**
>
> ![borderissue2](https://us1.discourse-cdn.com/inductiveautomation/original/3X/9/6/96542181392f3c2ce030abc410f19d89d86ac668.png)

> **Child Container Config**
>
> ![borderissue3](https://us1.discourse-cdn.com/inductiveautomation/original/3X/2/c/2c0d50e45f9948811c21b6940ade919fc025bca5.png)

---

<div class="post-metadata">

**Author:** ![YF129701](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/yf129701/32/60498_2.png) [@YF129701](https://forum.inductiveautomation.com/u/YF129701)\
**Post date:** [February 27, 2024, 9:08pm UTC](https://forum.inductiveautomation.com/t/8-1-25-tall-containers-in-scrollable-parent-container-do-not-render-borders-for-entire-height/86457/2 "2024-02-27T21:08:27Z")

</div>

I can confirm that this happens on 8.1.36 with a mockup of your setup - currently trying to figure out why...

---

<div class="post-metadata">

**Author:** ![YF129701](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/yf129701/32/60498_2.png) [@YF129701](https://forum.inductiveautomation.com/u/YF129701)\
**Post date:** [February 27, 2024, 9:42pm UTC](https://forum.inductiveautomation.com/t/8-1-25-tall-containers-in-scrollable-parent-container-do-not-render-borders-for-entire-height/86457/3 "2024-02-27T21:42:27Z")

</div>

So, I found a [SO post](https://stackoverflow.com/questions/66710341/border-doesnt-render-the-entire-width-of-its-container) that kinda addresses the same issue, and I think a resolution is to add

```css
height: max-content;

```

to your Child Container.

---

<div class="post-metadata">

**Author:** ![ryan.white](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/ryan.white/32/73193_2.png) [@ryan.white](https://forum.inductiveautomation.com/u/ryan.white)\
**Post date:** [February 27, 2024, 9:48pm UTC](https://forum.inductiveautomation.com/t/8-1-25-tall-containers-in-scrollable-parent-container-do-not-render-borders-for-entire-height/86457/4 "2024-02-27T21:48:58Z")

</div>

> [@YF129701](#):
>
> `height: max-content;`

Adding this did it, good find.