<code> text not obeying encapsulating div's max-width in Firefox
===

I would like the long code to wrap around inside the td and div. It does so in Chrome, but I can't get it to work in Firefox. In Firefox, the text just keeps going into the next td element. Could someone help me out? Other comments on my code are welcome too (e.g. "don't use so many divs" or something)

    <tr class="line">
			<td class="lineNumber">38</td>
			<td class="code"><div class="divCode"><code>    error = guess - n/guessjfdklsjf dklsjf kdlsjfkldsjfkl dsjfklds jfkldsjfkljdsa;lfkjdsakl;fjdskla;fjdksl;ajfkld;sajfkl;dsajfkl;dsa
                        <td class="otherClass">other stuff here</td>

    </code></div></td>
    </tr>

This is styled by the following CSS:  

    .line td{  
    padding-right: 10px;  
        padding-left: 10px;  
        font-family: monospace;  
        word-wrap: break-word;  
        max-width: 40ex;
    }  
  
    .code {
        white-space: pre;
        max-width: 40ex;
    }

    .divCode {
        max-width: 40ex;
    }

    code {
        max-width: 40ex;
        word-wrap:break-word;
    }

Thanks,
--h