# How to increase the height of Data Table embeds?

**URL:** <https://talk.observablehq.com/t/how-to-increase-the-height-of-data-table-embeds/9337>\
**Category:** Help\
**Created:** [June 3, 2024, 4:31am UTC](https://talk.observablehq.com/t/how-to-increase-the-height-of-data-table-embeds/9337 "2024-06-03T04:31:22Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![why-not](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/why-not/32/8933_2.png) [@why-not](https://talk.observablehq.com/u/why-not)\
**Post date:** [June 3, 2024, 4:31am UTC](https://talk.observablehq.com/t/how-to-increase-the-height-of-data-table-embeds/9337/1 "2024-06-03T04:31:22Z")

</div>

When I embed it, it defaults to a height, but when I try to increase it doesn’t increase the number of rows shown - rather there is a white space there. How do I increase the height of Data Table embeds to show more rows?

Here it how it looks currently.

 ![image](https://canada1.discourse-cdn.com/flex030/uploads/observablehq/original/2X/0/0c515087c71ff3d2e29103244befabf63545d370.png)

---

<div class="post-metadata">

**Author:** ![mootari](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/mootari/32/581_2.png) [@mootari](https://talk.observablehq.com/u/mootari)\
**Post date:** [June 3, 2024, 9:28am UTC](https://talk.observablehq.com/t/how-to-increase-the-height-of-data-table-embeds/9337/2 "2024-06-03T09:28:49Z")

</div>

The height of a data table is limited to at most 369px, and there is currently no option to increase it. To remove the whitespace at the bottom you will have to adjust the height of the iframe manually.

Notebook embeds also implement Embedly’s [Height Resizing standard](https://docs.embed.ly/reference/provider-height-resizing). You can find an example for the required adjustments here:

> **[examples/iframe-resize at main · observablehq/examples](https://github.com/observablehq/examples/tree/main/iframe-resize)**
>
> Examples of using Observable in a variety of contexts - observablehq/examples

---

<div class="post-metadata">

**Author:** ![jwoLondon](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/jwolondon/32/259_2.png) [@jwoLondon](https://talk.observablehq.com/u/jwoLondon)\
**Post date:** [June 3, 2024, 3:07pm UTC](https://talk.observablehq.com/t/how-to-increase-the-height-of-data-table-embeds/9337/3 "2024-06-03T15:07:12Z")

</div>

Depending on what you want your data table for, you could instead consider displaying it via [Inputs.table](https://observablehq.com/@observablehq/input-table), which has the option (among others) to set the number of rows to appear.

Personally I prefer `Inputs.table` anyway as I find its appearance less obtrusive and often more compact.
