How can I remove bootstrap style on pre element

Question

I use bootstrap and I have to use the <pre> in my code, but Bootstrap stylizes it and I don't like it. I know that I need to override it, but I don’t know which attributes I need to change, so <pre> looks simple in HTML without Bootstrap style.

 <link rel="stylesheet" type="text/css" href="bootstrap.min.css"> <style type="text/css"> pre{ } </style> 

So, what code did I put in the <pre> ?

Answer 1

Bootstrap erases like this:

 pre{ display: block; font-family: monospace; padding: 9.5px; margin: 0 0 10px; font-size: 13px; line-height: 1.42857143; color: #333; word-break: break-all; word-wrap: break-word; background-color: #f5f5f5; border: 1px solid #ccc; border-radius: 4px; } 

Therefore, I suggest you add these properties to the stylesheet and style them so that they look the way you want. Each browser is different, so asking for a basic style is a difficult task to answer.

Here is the basic style for html tags in each browser

• Firefox (Gecko) : http://mxr.mozilla.org/mozilla-central/source/layout/style/html.css . Or go to resource: // gre-resources / and look at html.css.
• Chrome / Safari (WebKit) : http://trac.webkit.org/browser/trunk/Source/WebCore/css/html.css
• Chrome (Blink) : https://chromium.googlesource.com/chromium/blink/+/master/Source/core/css/html.css
• Internet Explorer (Trident), all versions: http://www.iecss.com/

Hope this can help :)