Milligram: Wrong spacing if rowspan is used

Is this still open? Can i take a look once?

Apparently yes, see the codepen https://codepen.io/mapio/pen/VwwzRrR (notice how "Mare" in the "Horse" row has a space in front of it, differently from "Stallion")

hey @mapio i seen problem, where can i work this? can you make a Fork available in single html page?
I can't find table in milligram

I don't get you question and I'm not the mantainer of milligram… if you want to fix the bug, fork the repo and submit a pull request when done so that the repo owners can evaluate to accept it or not.

I opened a fork in this repo and submitted a pull request for my fix to this issue.
Im new to GitHub and not sure if I did this correctly.

oh I think I did this wrong. I just realized I edited an example file not a milligram file.

Ok I edited the minimal.css file from the milligram repo and I will see if they accept it or not.
I added classes so that when using rowspan and colspan the alignment of words in the subsequent columns is not thrown off.

Nope… I'm not the repo owner, but those files look to be generated (have a look at https://github.com/milligram/milligram/blob/master/.github/contributing.md#building) starting from sass files under the src directory.

To increase the chance of your PR being accepted, don't forget to run the tests (https://github.com/milligram/milligram/blob/master/.github/contributing.md#test) and check that your solution isn't breaking any one of them — if possible, add a new test showing the effectiveness of your solution.

@mapio thanks for helping @Lisagrant101

@mapio here you forgot adding the normalize.css support.
Please, let me know if you still need help.

@mapio here you forgot adding the normalize.css support.

I've added it now, it seems not to change the status of the issue.

@RamanaVem You can find the Table module here ./src/_Table.sass

@mapio I can is wrong, but as I understand it:

The problem is not when you use any attribute but when you use the example structure:

<table>
  <tr>
    <th>Animals</th>
  </tr>
  <tr>
    <th>Hippopotamus</th>
  </tr>
  <tr>
    <th>Horse</th>
    <td>Mare</td>
  </tr>
  <tr>
    <td>Stallion</td>
  </tr>
  <tr>
    <th>Crocodile</th>
  </tr>
  <tr>
    <th>Chicken</th>
    <td>Hen</td>
  </tr>
  <tr>
    <td>Rooster</td>
  </tr>
</table>

Note, this behavior is generated by:

td,
th {
  padding: 1.2rem 1.5rem;
}
td:last-child, 
th:last-child {
    padding-right: 0;
}
td:first-child,
th:first-child {
    padding-left: 0;
}

And even if you remove the attributes, there will still be "left white-space" in the same elements. Look: https://codepen.io/cjpatoilo/pen/yLYGQNy

So, we need to find some solution to soften this behavior when there is this specific structure or remove this spacing by default in all table styles.

I'm not sure to get your point.

My bug report is based on https://github.com/mdn/learning-area/blob/master/html/tables/basic/animals-table-fixed.html that (coming from MDN) I assume to be authoritative (even if it does not include thead and tbody elements, that are indeed optional as per HTML standard).

Unfortunately I'm no CSS expert and I can't fix the bug, or understand the reason why your CSS style makes it happen.

What is sure is that the above HTML example is valid and is rendered correctly unless you use your CSS style.

@mapio try to use:

th + td {
  padding-left: 0;
}

This code fixes the "white-space" in this specific example. Look:
https://codepen.io/cjpatoilo/pen/yLYGQNy

If what you suggest is a fix, please implement it in the library and release a new version.

@mapio the code above is not the final solution for a possible fix. There are other ways to get the same result. Look: https://codepen.io/cjpatoilo/pen/bGVOQzd

So, to make changes in Milligram I need to understand better all scenes to ensure that expected behavior. I've been work on a new version v1.4.0. Let me see what I can do for this.

Thank you for your contribution and for reporting this example.

Can I work on this issue?

Can I work on this issue?

I'm not the maintainer, but I can't see why you shouldn't!

Okay

hi @mapio , i made a PR for this issue, please review.

Dear @tusharck I'm not the maintainer of this project… for what it is worth, it seems that #274 fixes this bug, but I'm unable to accept PR for the project.

Hi @cjpatoilo , as @mapio said, the PR #274 made fixes the issue, can you please review it.