Difference between "view source" and "inspect element" - mysterious unwanted <b> tags are inserted

Question

I understand that modern browsers interpret one's HTML code in a certain way, and the result is that what one sees in "inspect element" in Google Chrome, for example, is different than what one sees in "view source".

Mysterious <b> and </b> tags that I had never added to the source code, are somehow appearing in my page when I view it in chrome and Firefox.

At first, I thought it may have been some javascript modifying my code, but after having ticked the "disable all scripts" button and reloaded the page, the mysterious tags remained.

Here is an example - this is a piece of the source code from my website, http://bns.endgame.pk/. No <b> or </b>tags anywhere in sight.

<a target="_blank" style="font-size:14px;" href="http://www.facebook.com/nightmarecake">Cake</a>.</font><br>  
<img src="https://fbcdn-profile-a.akamaihd.net/hprofile-ak-prn2/1119589_773184094_1664919821_q.jpg">
<img src="https://fbcdn-profile-a.akamaihd.net/hprofile-ak-prn2/1117767_15500423_790147733_q.jpg">
<img src="https://fbcdn-profile-a.akamaihd.net/hprofile-ak-prn2/186942_100001202221967_422509584_q.jpg">
<img src="https://fbcdn-profile-a.akamaihd.net/hprofile-ak-frc1/372541_547614112_115208298_q.jpg">
</td></tr>            
</table>    
</div>
</td></tr>
</table>
<div class="contents-container">
<div class="col1">
<div class="table1"><font class="title1">Blade & Soul database<br>

Here is that same exact portion of the website, when I open the site in chrome (all scripts disabled) and take a look at the stuff, with "inspect element":

<a target="_blank" style="font-size:14px;" href="http://www.facebook.com/nightmarecake">Cake</a>
"."
</font>
<br>
<img src="https://fbcdn-profile-a.akamaihd.net/hprofile-ak-prn2/1119589_773184094_1664919821_q.jpg">
<img src="https://fbcdn-profile-a.akamaihd.net/hprofile-ak-prn2/1117767_15500423_790147733_q.jpg">
<img src="https://fbcdn-profile-a.akamaihd.net/hprofile-ak-prn2/186942_100001202221967_422509584_q.jpg">
<img src="https://fbcdn-profile-a.akamaihd.net/hprofile-ak-frc1/372541_547614112_115208298_q.jpg">
</td>
</tr>
</tbody>
</table>
</div>
</b>
</td>
</tr>
</tbody>
</table>
<div class="contents-container">
<div class="col1">
<div class="table1"><font class="title1">
"
Blade & Soul database"
<br>

These <b> and </b> tags are being inserted at a whole bunch of places all over my files! What the hell is going on, here?! Am I formatting my HTML wrong, or something of the sort? Please help me out.

Please note that I am in the process of going through my file with a vaildator http://validator.w3.org/ as well, but it has been of no help in determining the problem ;__; ...

Answer 1

You are not escaping the content from your user, so someone posted something like: I really, reaally do appreciate it~! >w<b, I let you understand what's going next... (Line 853 on my browser, under the div with shoutbox_comment_section id).

The </b> tag is added by the Chrome development console because it tries to infer what you forgot to get valid XML.