using pre tag

when i want to display code in a page that should not be executed i write that html code inside

example 1

<pre>
<code>
#div{
float: left;
width: 900px;
height: auto;
}

</code>
</pre>

this is working fine, however when i write the following code, it is not appearing as code, instead it is being executed.

example 2

<pre>
<code>
<div id="topmenu">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Contact Us</a></li>
</ul>
</div>
</code>
</pre>

the list in this code is being executed, however i want the list code to appear like a code as in example 1

please advice.

thanks

 

Replace each instance of < with &lt;, and each > with &gt;

cheers,

gary