How to disable styling on <pre> in bootstrap

html css twitter-bootstrap twitter-bootstrap-3 pre
MohitC picture MohitC · Mar 16, 2016 · Viewed 9k times · Source

I am using HTML's <pre></pre> to render my text as is with \n and spaces in a block. But bootstrap's default behaviour puts a <pre> block in a bordered box with a grey background. I don't want that. I want it to displayed as plain text.

How to disable that styling behavior for pre?

Answer

Praveen Kumar Purushothaman picture Praveen Kumar Purushothaman · Mar 16, 2016

You can just do this:

pre {border: 0; background-color: transparent;}

Check this Vanilla CSS Un-Reset for default values of other properties.

Related questions

vertical-align with Bootstrap 3

I'm using Twitter Bootstrap 3, and I have problems when I want to align vertically two div, for example — JSFiddle link: The grid system in Bootstrap uses float: left, not display:inline-block, so the property vertical-align doesn't work. I tried using …

Read More
How to vertically center a container in Bootstrap?

I'm looking for a way to vertically center the container div inside the jumbotron and to set it in the middle of the page. The .jumbotron has to be adapted to the full height and width of the screen. The .…

Read More
How to add a search box with icon to the navbar in Bootstrap 3?

I am using the new Twitter Bootstrap 3, and am trying to place a search box like this (below) in the top navbar: In Bootstrap 2, it could've ben done like this: <form class="form-search" method="get" id="s" action="/"> &…

Read More