Bootstrap CSS overwriting Prettify CSS

  • Joseph

    (@jml6m)


    10 years, 10 months ago

    Hi everyone, I am using the Prettify GC Syntax Highlighter plugin and have surrounded my code with the proper tag:

    <pre class="prettyprint">
  // Put your code here.
</pre>

    However it simply displays text with bootstrap formatting (as seen in this picture): http://i.imgur.com/SPzI4rf.png

    I thought the Bootstrap CSS rules for ‘pre’ and ‘pre.prettyprint’ were overwriting the rules from the plugin, but I removed all tags that were being used from bootstrap.css to see if that resolved the issue, and it didn’t

Viewing 1 replies (of 1 total)
  • Thread Starter Joseph

    (@jml6m)

    10 years, 10 months ago

    Can someone help me here? Here is the css for the element (as returned by Firebug). Why aren’t the colors being applied to the text on keywords?

    pre.prettyprint {
    margin-bottom: 20px;
}
pre {
    background-color: #F5F5F5;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 4px 4px 4px 4px;
    display: block;
    font-size: 13px;
    line-height: 20px;
    padding: 9.5px;
    white-space: pre-wrap;
    word-break: break-all;
    word-wrap: break-word;
}
code, pre {
    color: #333333;
    font-family: Monaco,Menlo,Consolas,"Courier New",monospace;
}
Viewing 1 replies (of 1 total)
  • The topic ‘Bootstrap CSS overwriting Prettify CSS’ is closed to new replies.