/* Better styles for embedding GitHub Gists */ | |
.gist{font-size:13px;line-height:18px;margin-bottom:20px;width:100%} | |
.gist pre{font-family:Menlo,Monaco,'Bitstream Vera Sans Mono','Courier New',monospace !important} | |
.gist-meta{font-family:Helvetica,Arial,sans-serif;font-size:13px !important} | |
.gist-meta a{color:#26a !important;text-decoration:none} | |
.gist-meta a:hover{color:#0e4071 !important} |
This comment has been minimized.
This comment has been minimized.
mklemme
commented
Aug 29, 2013
Assuming you have included one in your html head, you add these to your style.css |
This comment has been minimized.
This comment has been minimized.
jrichardsz
commented
Oct 13, 2013
<style type="text/css">
/* Better styles for embedding GitHub Gists */
.line-data {
font-size:11px; font-family: Consolas,"Liberation Mono",Courier,monospace;
}
.line-numbers {
font-size:11px;
background-color: #ECECEC;
border-right: 1px solid #DDDDDD;
color: #AAAAAA;
padding: 0.0em;
text-align: right;
}
.line-pre {
font-size:11px;font-family: Consolas,"Liberation Mono",Courier,monospace;
}
</style>
Just put it on your head and go! Note that you must change the "font-size" in the 3 blocks to appreciate the line number of the code. |
This comment has been minimized.
This comment has been minimized.
Jayaramki
commented
Apr 18, 2014
Thanks... It works... |
This comment has been minimized.
This comment has been minimized.
Magdi
commented
May 2, 2014
Thanks man :) |
This comment has been minimized.
This comment has been minimized.
foxx
commented
May 10, 2014
Not bad, though I prefer 12px font, thanks! |
This comment has been minimized.
This comment has been minimized.
rabinshr
commented
May 30, 2014
Thank you Sir! |
This comment has been minimized.
This comment has been minimized.
ksobon
commented
Nov 3, 2014
Would you be able to advise on a method to remove a border around the code text part of the gist? It usually has two borders. One on the outside that i am ok with but there is one around the actual code that i would like to make either white/transparent or null. thank you, |
This comment has been minimized.
This comment has been minimized.
kensoh
commented
Jan 14, 2017
•
Hi @ksobon, yes there are different properties to control the default css of GitHub gist. I did that in this project by making all the borders white and making sure I define the properties after the embedded js - https://github.com/tebelorg/TA.Gist (PHP template that displays your GitHub gists as blog posts) |
This comment has been minimized.
This comment has been minimized.
sharifulislam52
commented
Mar 8, 2017
I don't know why. But the "font-size" property dont work for ".gist". |
This comment has been minimized.
This comment has been minimized.
M2skills
commented
Mar 29, 2017
great man Thanks! |
This comment has been minimized.
facebookegypt commentedJun 28, 2013
Hello,
<script src="https://gist.github.com/facebookegypt/This.js"></script>Sorry I'm not Html or JavaScripts pro or even average, I just use
to include in my Html page ... How can I add your code to implement the display of my Gist in my Html Page?
More details for a beginner please ...