Check out this code snippet:
<style type="text/css">
html, body {font:0.9em/1.2em arial, verdana, helvetica, sans-serif;}
#todayOn {background-color:#efefef; repeat-x top left;border-bottom:1px solid #ddd;border-top:1px solid #ddd;height:52px;margin:15px 0;}
#todayOn #pageTitle {float:left;padding-left:3px;}
#todayOn #pageTitle h2 {color:#feb425;font-size:32px;margin:10px 0 0 0;padding:0;}
#todayOn #pageTitle h2 em {color:#7498c0;display:block;font-size:14px;font-style:italic;font-weight:normal;line-height:20px;padding:5px 0 0 0;}
</style>
<div id="todayOn">
<div id="pageTitle">
<h2>TODAY <em>on this page.com</em></h2>
</div>
</div>
The subheader "on this page.com" displays as desired in Firefox, IE (6+), and Opera but is slightly off in Webkit browsers like Chrome and Safari. What could be causing this discrepancy? Any insights are appreciated.