I am using Google Prettify with Twitter Bootstrap. It is working, but for some reason, the line numbers are not appearing.
Here is the markup:
<pre class="prettyprint linenums">
<ol class="linenums">
<li class="L0">
<span class="kwd">public</span>
<span class="pln"> </span>
<span class="kwd">override</span>
<span class="pln"> </span>
<span class="kwd">void</span>
<span class="pln"> </span>
<span class="typ">Dispose</span>
<span class="pun">()</span>
</li>
<li class="L1">
<span class="pln"> </span>
<span class="pun">{</span>
</li>
<li class="L2">
<span class="pln"> </span>
<span class="kwd">base</span>
<span class="pun">.</span>
<span class="typ">Dispose</span>
<span class="pun">();</span>
</li>
<li class="L3">
<span class="pln"> </span>
<span class="pun">}</span>
</li>
</ol>
</pre>
and I call it like this:
<script type="text/javascript">
$(document).ready(function () {
prettyPrint();
});
</script>
I don't have any custom CSS.. just using the Bootstrap CSS only..
I recommend you use those 2 files:
http://twitter.github.com/bootstrap/assets/js/google-code-prettify/prettify.css
http://twitter.github.com/bootstrap/assets/js/google-code-prettify/prettify.js
and add this in your footer:
<script>
!function ($) {
$(function(){
window.prettyPrint && prettyPrint()
})
}(window.jQuery)
</script>
found in application.js from http://twitter.github.com/