# Drill down on Canvas for Markdown element

**URL:** <https://discuss.elastic.co/t/drill-down-on-canvas-for-markdown-element/178970>\
**Category:** Kibana\
**Tags:** canvas\
**Created:** [April 29, 2019, 5:34pm UTC](https://discuss.elastic.co/t/drill-down-on-canvas-for-markdown-element/178970 "2019-04-29T17:34:07Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![syedsfayaz](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/syedsfayaz/32/46657_2.png) [@syedsfayaz](https://discuss.elastic.co/u/syedsfayaz)\
**Post date:** [April 29, 2019, 5:34pm UTC](https://discuss.elastic.co/t/drill-down-on-canvas-for-markdown-element/178970/1 "2019-04-29T17:34:07Z")

</div>

Since there was no reply create a new topic.

I was looking for a drill-down option on canvas Markdown widget. I don't see an option for drill down.  
Is it that I can only enable drill down by using Link or I can setup a drill down for an entire panel?

> [@Change the shape of markdown](https://discuss.elastic.co/t/change-the-shape-of-markdown/176705):
>
> Hi I want to use markdown to show custom data on kibana probably in canvas or my dashboard. But I see it only in rectangular shape. Is there a way can change the shape to like the above in image. Or any shape. Do we have the flexibility to enable different background colour for markdown based on some condition I can specify. If yes, Can you guide me where I can.

---

<div class="post-metadata">

**Author:** ![Catherine\_Liu](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/catherine_liu/32/34294_2.png) [@Catherine\_Liu](https://discuss.elastic.co/u/Catherine_Liu)\
**Post date:** [April 29, 2019, 8:24pm UTC](https://discuss.elastic.co/t/drill-down-on-canvas-for-markdown-element/178970/2 "2019-04-29T20:24:44Z")

</div>

@syedsfayaz Please check out my reply on the github issue you opened: [https://github.com/elastic/kibana/issues/35201#issuecomment-487701812](https://github.com/elastic/kibana/issues/35201#issuecomment-487701812)

---

<div class="post-metadata">

**Author:** ![syedsfayaz](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/syedsfayaz/32/46657_2.png) [@syedsfayaz](https://discuss.elastic.co/u/syedsfayaz)\
**Post date:** [April 29, 2019, 9:50pm UTC](https://discuss.elastic.co/t/drill-down-on-canvas-for-markdown-element/178970/3 "2019-04-29T21:50:19Z")

</div>

Thank you. Are there any plans on adding this functionality?

---

<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:** [May 27, 2019, 9:50pm UTC](https://discuss.elastic.co/t/drill-down-on-canvas-for-markdown-element/178970/4 "2019-05-27T21:50:28Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![Alex\_Marquardt](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/alex_marquardt/32/42925_2.png) [@Alex\_Marquardt](https://discuss.elastic.co/u/Alex_Marquardt)\
**Post date:** [October 11, 2019, 1:09pm UTC](https://discuss.elastic.co/t/drill-down-on-canvas-for-markdown-element/178970/5 "2019-10-11T13:09:09Z")

</div>

> [@syedsfayaz](#):
>
> on't see an option for drill down.  
> Is it that I can only enable drill down by using Link or I can setup a drill down for an entire panel?

You can accomplish this by hacking the CSS - however if you do this, then you will not be able to select the element to edit it in Canvas (as clicking on the markdown element will immediately take you to the link). If you do need to edit the markdown element after implementing the hack described below, then you'll have to temporarily disable the css associated with the element by using (for example) chrome developer tools.

The hack that worked for me is the following:

```auto
filters
| demodata
| markdown 
  "# Testing the to see if this works

[link to page 2](canvas#/workpad/workpad-ad72a4e9-b422-480c-be6d-a64a0b79541d/page/2)

Bla blah blah"
| render 
  css=".canvasRenderEl a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-indent: -9999px; // hide the link text.
  overflow: hidden; // hide the link text.
}"

```

After implementing the above, any click on the element will take you to the linked page. If you need to edit the element, you can temporarily disable this behaviour in Developer tools by removing the width:100% and height:100% from the element , as shown in the image below:

 ![05](https://us1.discourse-cdn.com/elastic/original/3X/1/1/119e91db9e13b23b36d5c7b9c3d2afb7dfcb4517.png)
