# MarkUp table example **URL:** \ **Category:** Ask for Help\ **Created:** [January 16, 2020, 8:31pm UTC](https://community.glideapps.com/t/markup-table-example/3671 "2020-01-16T20:31:03Z")\ **Posts on this page:** 18\ **Page:** 1
**Author:** ![dmilleravid](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/dmilleravid/32/2230_2.png) [@dmilleravid](https://community.glideapps.com/u/dmilleravid)\ **Post date:** [January 16, 2020, 8:31pm UTC](https://community.glideapps.com/t/markup-table-example/3671/1 "2020-01-16T20:31:03Z")
Does anyone have an example of a MarkUp table working with a Template column? I’d love to see code sample for a 3-column table, where each column is justified a different way (left, center, right), and where the entire table spans the entire Tab layout. I can’t seem to force the table to span the entire width of the Layout or force the width of any specific column, so I’m been stymied so far. Can anyone post a sample that works? ---
**Author:** ![Jeff\_Hager](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jeff_hager/32/43_2.png) [@Jeff\_Hager](https://community.glideapps.com/u/Jeff_Hager)\ **Post date:** [January 16, 2020, 8:56pm UTC](https://community.glideapps.com/t/markup-table-example/3671/2 "2020-01-16T20:56:24Z")
I’ve never been able to get a markdown table to span the entire width. You can set the justification, but it always compresses everything to the left hand side with very small margins between cells. I’ve tried tricking it with extra spaces and anything I can think of. I can get it to push to the right side, but then I risk text wrapping. Unfortunately, because of this, I’m stuck using html tables, although I’m prepared to switch to markdown tables if the html stops working. I would love some sort of table component, or in your case, a markdown table that spans to 100%. ---
**Author:** ![dmilleravid](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/dmilleravid/32/2230_2.png) [@dmilleravid](https://community.glideapps.com/u/dmilleravid)\ **Post date:** [January 16, 2020, 9:05pm UTC](https://community.glideapps.com/t/markup-table-example/3671/3 "2020-01-16T21:05:27Z")
I’ve tried all those things myself. I have not played with html tables. Could you post a simple example of how you’ve done that? I’d like to play with it. Thanks. ---
**Author:** ![Rosewebstudio](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/rosewebstudio/32/12261_2.png) [@Rosewebstudio](https://community.glideapps.com/u/Rosewebstudio)\ **Post date:** [January 16, 2020, 9:43pm UTC](https://community.glideapps.com/t/markup-table-example/3671/4 "2020-01-16T21:43:07Z")
Does this help? [https://www.tablesgenerator.com/markdown\_tables](https://www.tablesgenerator.com/markdown_tables) ---
**Author:** ![dmilleravid](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/dmilleravid/32/2230_2.png) [@dmilleravid](https://community.glideapps.com/u/dmilleravid)\ **Post date:** [January 16, 2020, 9:47pm UTC](https://community.glideapps.com/t/markup-table-example/3671/5 "2020-01-16T21:47:13Z")
I’ve tried all that … It didn’t help me. ---
**Author:** ![Rosewebstudio](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/rosewebstudio/32/12261_2.png) [@Rosewebstudio](https://community.glideapps.com/u/Rosewebstudio)\ **Post date:** [January 16, 2020, 10:08pm UTC](https://community.glideapps.com/t/markup-table-example/3671/6 "2020-01-16T22:08:12Z")
Oh ok, let me know if you find anything else ---
**Author:** ![Christophe\_HK](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/christophe_hk/32/4161_2.png) [@Christophe\_HK](https://community.glideapps.com/u/Christophe_HK)\ **Post date:** [January 16, 2020, 11:22pm UTC](https://community.glideapps.com/t/markup-table-example/3671/8 "2020-01-16T23:22:03Z")
You can use several   in the table headers row to force the width of each column. If you know how many characters you can write on the full width tab, with calculation you can adjust the width of each column so that the 3 columns will be adjusted to the width tab. Example, col1=15char, col2=10char, col3=15char : |                 |            |                 | | --- | --- | --- | | **item1** | : | value1 | | **item2** | : | value2 | | **item3** | : | value3 | BUT there’s no way with markdown table to adjust automatically to the tab width… ---
**Author:** ![Jeff\_Hager](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jeff_hager/32/43_2.png) [@Jeff\_Hager](https://community.glideapps.com/u/Jeff_Hager)\ **Post date:** [January 17, 2020, 12:00am UTC](https://community.glideapps.com/t/markup-table-example/3671/9 "2020-01-17T00:00:39Z")
The best example I have is in this app: [https://vkjff.glideapp.io](https://vkjff.glideapp.io) It’s an old version of my app and it’s a bit complicated since I build the the tables dynamically. Each row with html tags is created on each lesson in the Lessons sheet. Everything is ultimately put together in the Invoices sheet. I think the link from @Rosewebstudio would be a great way to formulate the table. ---
**Author:** ![Rosewebstudio](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/rosewebstudio/32/12261_2.png) [@Rosewebstudio](https://community.glideapps.com/u/Rosewebstudio)\ **Post date:** [January 17, 2020, 4:04am UTC](https://community.glideapps.com/t/markup-table-example/3671/10 "2020-01-17T04:04:35Z")
Looks good, any chance we can see the sheet? ---
**Author:** ![Jeff\_Hager](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jeff_hager/32/43_2.png) [@Jeff\_Hager](https://community.glideapps.com/u/Jeff_Hager)\ **Post date:** [January 17, 2020, 4:12am UTC](https://community.glideapps.com/t/markup-table-example/3671/11 "2020-01-17T04:12:23Z")
You can copy the app. The sheet comes along with it. 🙂 ---
**Author:** ![dmilleravid](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/dmilleravid/32/2230_2.png) [@dmilleravid](https://community.glideapps.com/u/dmilleravid)\ **Post date:** [January 17, 2020, 1:32pm UTC](https://community.glideapps.com/t/markup-table-example/3671/12 "2020-01-17T13:32:22Z")
@Jeff_Hager your project gave me a lot of new ideas to play around with. I didn’t realize you could embed html into the Rich Text fields like that. I’m sure I’m going to figure out how to solve my issues with html tags … so thanks!!! Of course writing html code flies in the face of the “no-code” movement, but I have a bunch of webhooks and api calls feeding my Google Sheet anyway so my project isn’t exactly no-code to begin with. To me, all this is really “less-code”, especially for front end u/i stuff, which tends to be the most frustration part for data-geeks like me. ---
**Author:** ![Jeff\_Hager](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jeff_hager/32/43_2.png) [@Jeff\_Hager](https://community.glideapps.com/u/Jeff_Hager)\ **Post date:** [January 17, 2020, 2:00pm UTC](https://community.glideapps.com/t/markup-table-example/3671/13 "2020-01-17T14:00:05Z")
Just keep in mind that html isn’t recommended by glide and functionality could break at any time. I know some tags do not work. I have some css code that stopped working for me awhile back. Just be prepared if functionally stops working at some point in the future. ---
**Author:** ![yinon\_raviv](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/yinon_raviv/32/1627_2.png) [@yinon\_raviv](https://community.glideapps.com/u/yinon_raviv)\ **Post date:** [January 17, 2020, 4:59pm UTC](https://community.glideapps.com/t/markup-table-example/3671/14 "2020-01-17T16:59:47Z")
You mean something like this [https://yinonraviv.glideapp.io/](https://yinonraviv.glideapp.io/) ---
**Author:** ![Lori\_W](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lori_w/32/876_2.png) [@Lori\_W](https://community.glideapps.com/u/Lori_W)\ **Post date:** [February 3, 2020, 2:29am UTC](https://community.glideapps.com/t/markup-table-example/3671/15 "2020-02-03T02:29:09Z")
How did you do the icons as links on the front page, are they tiles? ---
**Author:** ![yinon\_raviv](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/yinon_raviv/32/1627_2.png) [@yinon\_raviv](https://community.glideapps.com/u/yinon_raviv)\ **Post date:** [February 3, 2020, 9:06am UTC](https://community.glideapps.com/t/markup-table-example/3671/16 "2020-02-03T09:06:34Z")
no, when you use image in markdown you cann relate to alt text and link: [](“LINK TO USE”) ---
**Author:** ![Lori\_W](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lori_w/32/876_2.png) [@Lori\_W](https://community.glideapps.com/u/Lori_W)\ **Post date:** [February 3, 2020, 2:48pm UTC](https://community.glideapps.com/t/markup-table-example/3671/17 "2020-02-03T14:48:16Z")
Thank you for your reply. The image you tried to include won’t load (I’m assuming it’s an image). Willing to try again? ---
**Author:** ![Lori\_W](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lori_w/32/876_2.png) [@Lori\_W](https://community.glideapps.com/u/Lori_W)\ **Post date:** [February 3, 2020, 7:04pm UTC](https://community.glideapps.com/t/markup-table-example/3671/18 "2020-02-03T19:04:42Z")
C an you show me an example of what the Markdown code would look like? ---
**Author:** ![Christophe\_HK](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/christophe_hk/32/4161_2.png) [@Christophe\_HK](https://community.glideapps.com/u/Christophe_HK)\ **Post date:** [February 3, 2020, 9:47pm UTC](https://community.glideapps.com/t/markup-table-example/3671/19 "2020-02-03T21:47:18Z")
``` | h1 | h2 | h3 | |:-:|:-:|:-:| |[![Glide](https://assets.website-files.com/5c1a86d850589562c952a22b/5c883bda91a98e4ab0ffc14a_logo-glide-color.svg )](https://www.glideapps.com)|[![Glide.](https://assets.website-files.com/5c1a86d850589562c952a22b/5c883bda91a98e4ab0ffc14a_logo-glide-color.svg )](https://www.glideapps.com)|[![Glide.](https://assets.website-files.com/5c1a86d850589562c952a22b/5c883bda91a98e4ab0ffc14a_logo-glide-color.svg)](https://www.glideapps.com)| ``` gives : | h1 | h2 | h3 | | --- | --- | --- | | [![Glide](https://assets.website-files.com/5c1a86d850589562c952a22b/5c883bda91a98e4ab0ffc14a_logo-glide-color.svg)](https://www.glideapps.com) | [![Glide.](https://assets.website-files.com/5c1a86d850589562c952a22b/5c883bda91a98e4ab0ffc14a_logo-glide-color.svg)](https://www.glideapps.com) | [![Glide.](https://assets.website-files.com/5c1a86d850589562c952a22b/5c883bda91a98e4ab0ffc14a_logo-glide-color.svg)](https://www.glideapps.com) |