Struggling with quoting codes...

Been struggling to quote django code in the blog, even by pasting code in between the 'pre' tags, some of the code still get parsed. Or even worst, it run all over the blog, overlap with all the other elements. Google around, and find a really helpful CSS tips in SitePoint's forum, so now I can post codes in blogger nicely.

To do so, just declare a div, define the width, height and set overflow to auto, so once the content is longer then the prefix width or height, the browser will display a scroll bar for easy navigation.

<style type="text/css">
div.terms
{
width: 20em;
height: 15em;
overflow: auto;
}
</style>

Whenever you need to paste django code, just call the specific div class, "terms", and put in the codes...Example,

<div class="terms">
{% extends "base" %}
{% block content %}
<h2>Blog: {{ year }} Archive</h2>
<ul>
{% for date in date_list %}
<li><a href="{{ date|date:"M"|lower }}/">{{ date|date:"F" }}</a></li>
{% endfor %}
</ul>
{% endblock %}

</div>

So there, now I have my codes nicely sitting in a scrollable area...