Wrong spacing if rowspan is used

[mapio]

Take the example at https://developer.mozilla.org/en-US/docs/Learn/HTML/Tables/Basics, more specifically the code at https://github.com/mdn/learning-area/blob/master/html/tables/basic/animals-table-fixed.html and point it to this css instead of the provided one.

You get (with the latest Firefox on OSX) what you see in the attached image, which is not correct (Hen and Mare seem to have some white-space to their left).

[RamanaVem]

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

[mapio]

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")

[RamanaVem]

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

[mapio]

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.

[Lisagrant101]

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.

[Lisagrant101]

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

[Lisagrant101]

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.

[mapio]

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.

[cjpatoilo]

@mapio thanks for helping @Lisagrant101

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

[mapio]

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

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

[cjpatoilo]

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

[cjpatoilo]

@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.

[mapio]

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.

[cjpatoilo]

@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

[mapio]

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

[cjpatoilo]

@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.

[srishtij2000]

Can I work on this issue?

[mapio]

Can I work on this issue?

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

[srishtij2000]

Okay

[tusharck]

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

[mapio]

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.

[tusharck]

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

[Zaid-Parkar]

Hello Sir,
I would like to contribute to this project,
I am new to hacktoctoberfest and this would be a great beginning.
Thank you...

[TRIPATHISHIWANSHI]

Hello Sir,
I am new to Hactoberfest and I would like to contribute to this project

[Yugalsaini123]

I am a beginner, can i also contribute to this project?

[shaaoni]

Hey @mapio Is this still open ? Then I want to contribute to it.

[Yugalsaini123]

<!-- /* Font Definitions */ @font-face {font-family:"Cambria Math"; panose-1:2 4 5 3 5 4 6 3 2 4;} @font-face {font-family:Calibri; panose-1:2 15 5 2 2 2 4 3 2 4;} /* Style Definitions */ p.MsoNormal, li.MsoNormal, div.MsoNormal {margin:0cm; font-size:11.0pt; font-family:"Calibri",sans-serif;} a:link, span.MsoHyperlink {mso-style-priority:99; color:blue; text-decoration:underline;} .MsoChpDefault {mso-style-type:export-only;} @page WordSection1 {size:612.0pt 792.0pt; margin:72.0pt 72.0pt 72.0pt 72.0pt;} div.WordSection1 {page:WordSection1;} -->I think, It was the previous years problem. Sent from Mail for Windows From: shaaoniSent: 07 October 2023 01:48To: milligram/milligramCc: Yugal Saini; CommentSubject: Re: [milligram/milligram] Wrong spacing if rowspan is used (#217) Hey @mapio Is this still open ? Then I want to contribute to it.—Reply to this email directly, view it on GitHub, or unsubscribe.You are receiving this because you commented.Message ID: ***@***.***> 

[GitGuySu]

I am new to Hacktoberfest. If this issue is still open, I wanna contribute to this.

[mapio]

The last commit appears to be in 2020. This is probably an abandoned project. Not sure the maintainer will accept PRs.