CSS makes div unequal in firefox and chrome -


i've made 2 divs navigation given css: first button:

.optionsbutton .dropdownbuttonoverlay {     margin: 0px -95px 0px 0px;     width: 92px;     height: 38.5px;     float: right;     z-index: 2; }    .tenpxleft {     margin-left: 10px;     }  .floatright {     float: right; }  .regularbutton {     background-color: #008be1;      border: none; }  .optionsbutton {     border-radius: 3px;     -webkit-appearance: none; } 

and second button this:

.defaultbutton {     font-family: 'open sans', segoe ui, verdana, helvetica, sans-serif;      border-radius: 3px;     font-size: 14px;     color: #ffffff;      padding: 10px 15px;     -webkit-appearance: none;     margin: 0; /* fixes chrome bug */ }  .tenpxleft {     margin-left: 10px;     }  .floatright {     float: right; }  .regularbutton {     background-color: #008be1;      border: none; } 

the problem dealing fine on chrome , ie (alligned nicely). when go firefox don't alligned intended (i putting them in div top menu thingy).

it seems font influencing that. i've tried making font percentage (100.01%), makes nice in firefox, ruins view in ie , chrome. how fix this?

i found out firefox tends work differently on divs (i knew before, solution unclear), therefore added max-height attribute on button expands due text-size in it's body fixed problem.


Comments

Popular posts from this blog

toolbar - How to add link to user registration inside toobar in admin joomla 3 custom component -

linux - disk space limitation when creating war file -