Shoutbox

I'm having the exact same thing. The font family isn't set properly until I refresh the page.

I think this has something to do with the CSS, I'll let Firebug have a look what's going on.

Firefox 3.0.4 on Vista Ultimate x64 SP1

---

Okay, think I found it. A post's content is embedded in a FONT tag like this:

code:

---

<td class="trow1" width="85%" style="vertical-align:top;">
<table width="100%"><tr><td>
<span class="smalltext"><b>Post title goes here</b><br /><br /></span>
<font size="2" face="verdana,tahoma,arial,helvetica">Post goes here</font></td></tr></table>
</td>

---

Now, everyone should know by now that you should never use deprecated HTML tags such as FONT when you have a much more reliable formatting system called CSS. The problem here is that code blocks are formatted like this:

code:

---

<blockquote class="code_body"><span class="smalltext">code:</span><hr size="1" color="#000000" /><br />
woo<br />
<hr size="1" color="#000000" /></blockquote><br />

---

The "code_body" class is defined as followed:

code:

---

.code_body { font-family: monospace; }

---

which basically tells the renderer to use the mono-space font as specified in the browser's preferences. The problem lies at two points:

• The use of FONT. Don't use it. Never. It's evil. Place the whole post body in a DIV and give it a class like "post_body" which sets the font family right.
  
• The specificity of the CSS selectors. The CSS definition of .code_body has a specificity of 1, which is way too low and will easily be overwritten by the FONT tag if not used properly. Get some more specificity! Use things like:
  

  code:

  ---

  table tr td .code_body
     or
  .post_body .code_body

  ---

We really need an upgrade to a newer version of MyBB and get those templates rewritten. They're coded in an age where HTML completely defined the design of a web page and CSS wasn't mainstream yet.

* Matti looks at WDZ...