<h2 id="heading-situation">Situation</h2>
<p>In general, to use 'overflow', the target should have a length.</p>
<p>However, even though the target doesn't have a length, if 'flex-grow' is used, 'overflow' can be applied.</p>
<p>However, the parent should have a length.</p>
<p>However, even though the parent doesn't have a length and 'flex-grow' is used, if the element itself has a length, 'overflow' can be applied.</p>
<h2 id="heading-example-1-the-parent-has-a-length">Example 1: The Parent Has a Length</h2>
<div class="embed-wrapper"><div class="embed-loading"><div class="loadingRow"></div><div class="loadingRow"></div></div><a class="embed-card" href="https://codepen.io/bada3670/pen/JjBNRyo">https://codepen.io/bada3670/pen/JjBNRyo</a></div>
<p> </p>
<h2 id="heading-example-2-the-parent-doesnt-have-a-length-amp-the-element-has-a-length">Example 2: The Parent Doesn't Have a Length &amp; the Element Has a Length</h2>
<div class="embed-wrapper"><div class="embed-loading"><div class="loadingRow"></div><div class="loadingRow"></div></div><a class="embed-card" href="https://codepen.io/bada3670/pen/QWBvKMx">https://codepen.io/bada3670/pen/QWBvKMx</a></div>


## Situation

In general, to use 'overflow', the target should have a length.

However, even though the target doesn't have a length, if 'flex-grow' is used, 'overflow' can be applied.

However, the parent should have a length.

However, even though the parent doesn't have a length and 'flex-grow' is used, if the element itself has a length, 'overflow' can be applied.

## Example 1: The Parent Has a Length

%[https://codepen.io/bada3670/pen/JjBNRyo] 

## Example 2: The Parent Doesn't Have a Length & the Element Has a Length

%[https://codepen.io/bada3670/pen/QWBvKMx]

examplist

examplist

Using 'overflow' in 'flex-grow'

Situation

Example 1: The Parent Has a Length

Example 2: The Parent Doesn't Have a Length & the Element Has a Length