why are my css content boxes different sizes in firefox and internet explorer?

MovieMan

New Member
EDIT / SOLVED Found my own answer. For everyone that's wondering, it's:\[code\]DIV{-moz-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;}\[/code\]I have the following CSS code which I believe is pretty much "normal" and should therefor my interpreted by all browsers equally. The problem is that in Firefox the box is about 20 pixels wider than in Internet Explorer. What is the cause? How can I get them equally wide?Here is the CSS code:\[code\]<style type="text/css">.commentbox{background-color: #ffffff;width: 200px;border-top-color: #D1D1D1;border-top-style: solid;border-top-width: 1px;border-bottom-color: #D1D1D1;border-bottom-style: solid;border-bottom-width: 1px; border-left-color: #D1D1D1;border-left-style: solid;border-left-width: 1px;border-right-color: #D1D1D1;border-right-style: solid;border-right-width: 1px; box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.09);padding-bottom: 9px;padding-left: 9px;padding-right: 9px;padding-top: 9px;position:relative;display:block;}.title{padding-top: 5px;padding-bottom: 5px;font-family: Verdana;font-size: 12px;}.count{text-align:right;}</style>\[/code\]And the HTML code:\[code\]<body bgcolor="#f3f3f3"><div class="commentbox"><div class="title">some long long long text that might take up two lines</div><div class="count">123</div></div>\[/code\]Here is a jsfiddle example
 
Top