Just installed the ‘Embed GitHub Gist’ plugin to WordPress and while it makes embedding gists super easy, I found out that its CSS doesn’t mesh well with the theme I’m using on this site. What ended up happening is that the line numbers were spaced out more than the code, so it made it look like there was a bunch of empty white space at the end of the code.

To resolve this, you just have to add a line to your theme’s CSS file (because the plugin’s CSS is dynamically generated):

.gist pre.line-pre {
	line-height: 1.714285714 !important;

The !important is needed; otherwise, the plugin’s css will override the settings. This line will (vertically) space out the lines of code to match the spacing of the line numbers.

Leave a Comment

Your email address will not be published. Required fields are marked *