title: How to debug web page rendering compatibility issues across browsers?
body: <p>I am developing a web page primarily using Firefox. Often I encounter that my web page renders properly in Firefox but has some unexpected behavior in Chrome and IE. </p>
  
  <p>Generally if its related to javascript, I usually open Developer Console in Chrome and see if there were any errors and that gives me a clue as to what might be wrong.
  Unfortunately, I am generally lost if its a CSS related or HTML element issue.</p>
  
  <p>In one particular case, I have placed a div inside a <code>&lt;td&gt;</code> and I am lost as to why the chrome cannot render it properly irrespective of the fact that firefox is happy and does not complain.  </p>
  
  <p>So my question is, how to debug issues related to rendering of HTML pages in Chrome and CSS and determine what might be offending.</p>
  
  <p>My related question is, is there a guidelines to make my web page work in almost all the popular browsers with little effort? I am particularly thinking in terms of tool or process which will warn me of compatibility issues with my web page. </p>