# EUIDataGrid fullscreen getting cut off in custom plugin

**URL:** <https://discuss.elastic.co/t/euidatagrid-fullscreen-getting-cut-off-in-custom-plugin/247401>\
**Category:** Kibana\
**Created:** [September 3, 2020, 2:14pm UTC](https://discuss.elastic.co/t/euidatagrid-fullscreen-getting-cut-off-in-custom-plugin/247401 "2020-09-03T14:14:53Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![npm\_install](https://avatars.discourse-cdn.com/v4/letter/n/c68b51/32.png) [@npm\_install](https://discuss.elastic.co/u/npm_install)\
**Post date:** [September 3, 2020, 2:14pm UTC](https://discuss.elastic.co/t/euidatagrid-fullscreen-getting-cut-off-in-custom-plugin/247401/1 "2020-09-03T14:14:54Z")

</div>

Hi, so I am creating a custom plugin for Kibana on the new plugin platform (developing on the 7.6.2 version of Kibana), and I am utilizing the EuiDataGrid component, which has a fullscreen button. However, when I press the fullscreen button on the data grid, it gets cut off by the header and the sidebar. I found this [issue](https://github.com/elastic/eui/issues/2624) on Github, but I'm not sure how to apply this to my plugin. How can I fix this styling issue?

---

<div class="post-metadata">

**Author:** ![dsnider](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/dsnider/32/44068_2.png) [@dsnider](https://discuss.elastic.co/u/dsnider)\
**Post date:** [September 3, 2020, 10:50pm UTC](https://discuss.elastic.co/t/euidatagrid-fullscreen-getting-cut-off-in-custom-plugin/247401/2 "2020-09-03T22:50:59Z")

</div>

You'll want to utilize `.euiDataGrid__restrictBody` which is a selector applied to the body when datagrid is in full screen mode, telling the various chrome bits to hide. You can see how this works in an in-progress PR. [https://github.com/elastic/kibana/pull/67259](https://github.com/elastic/kibana/pull/67259)

Note that you will need to modify this for older versions of Kibana, which themselves use older versions of EUI.

```auto
.euiDataGrid__restrictBody .chrHeaderWrapper {
  display: none;
}

```

 ![](https://us1.discourse-cdn.com/elastic/original/3X/2/c/2ceab64544cdd8306e1b55cbe9e5d1da2c9b7fa4.png)

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)\
**Post date:** [October 1, 2020, 10:51pm UTC](https://discuss.elastic.co/t/euidatagrid-fullscreen-getting-cut-off-in-custom-plugin/247401/3 "2020-10-01T22:51:01Z")

</div>

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.