How to center align a pre tag in HTML
Question
I'm trying to post some code on a blog using the pre tag. Something like this:
void function(){return 0;}
Now I want all this code to be center aligned. I'm not talking just about the text but also about the border around it. The width is set currently to 60%. So I want all of this to be center aligned. Is there a way to do it?
Solution
Add a custom CSS <div>
Class that sets font to courier
(10pt) and has left and right margins set in so that it's centered on the page.
.code {
font-family:courier;
font-size: 10pt;
margin: 5px; border: 1px solid black;
}
Then call it as follows:
<div class="code">Your Code Here</div>
The magic happens in the margin
section. You can set all 4 attributes, but if you just set one, then it makes it a margin of that size all the way around.
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow