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
Post a Comment