Search code examples
githubgisthugo

GitHub Gist CSS

I've embedded a GitHub Gist in a website for the first time, and am having some issues with how it appears. It seems like something in my Hugo theme's CSS is adding space above line 1 and below line 13.

The problematic display can be seen here.

Anyone have thoughts on how I could remove that space? I've never see a Gist render like this before for, nor can I find any questions on here that get at what I am seeing.

Thanks for your help!

Solution

  • gist-embed adds a class of data to the table container. It is used to customize the look of the embedded gist. Adjust your CSS selectors to fix the problem. I am sure you are inadvertently styling the data class directly, when in actuality you want to style a compound selector article.data.

    Revisit your CSS code and adjust your selectors to reflect what you desire.