CODEWITHSUNDEEP
githubgithub-flavored-markdown
hant0508
hant0508

Reputation: 556

How to make table columns with the same width in GitHub markdown?

I'm trying to make table with two identical screenshots, but the right column is wider then left one. Moreover, it depends on text in the row below, but I don't clearly understand, how it depends exactly.

Two simple examples:

![img](https://raw.githubusercontent.com/hant0508/tmp/master/1.png) | ![img](https://raw.githubusercontent.com/hant0508/tmp/master/1.png)
:---:|:---:
Usage on GNOME 3 | Drag-and-drop on GNOME 3

enter image description here

![img](https://raw.githubusercontent.com/hant0508/tmp/master/1.png) | ![img](https://raw.githubusercontent.com/hant0508/tmp/master/1.png)
:---:|:---:
Usage on GNOME 3 | Drag and drop on GNOME 3

enter image description here

The same text length, the same words... What's wrong with hyphens and how can I fix it?

Upvotes: 5

Views: 3444

Answers (2)

Oskar Asplin
Oskar Asplin

Reputation: 31

I had this same issue and was only able to solve it with html. You can add html code directly into the markdown file:

<table width="100%">
  <thead>
    <tr>
      <th width="50%">First header</th>
      <th width="50%">Second header long</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td width="50%"><img src="https://docs.github.com/assets/cb-194149/images/help/images/view.png"/></td>
      <td width="50%"><img src="https://docs.github.com/assets/cb-194149/images/help/images/view.png"/></td>
    </tr>
  </tbody>
</table>

Upvotes: 1

BrechtDeMan
BrechtDeMan

Reputation: 6912

If the only difference is truly the hyphen, try a different type of hyphen (e.g. an 'actual' hyphen, instead of the minus sign: http://unicode-table.com/en/2010/).

I should say I cannot reproduce this exactly. The images in my example (left vs. right) are about a pixel or so different, not as much as yours: enter image description here

Upvotes: 1

Related Questions