I have run into this a couple of times - I coded or modified a CSS template with a specific thing in mind, yet the browser displays it differently than intended. When i use "Inspect Element" in Chrome, it shows the attributes I intended associated with that element, yet the browser is showing something different. What are the possible options from here as far as figuring out the issue/getting the site to look how you want?
Before I had an issue that I can't remember exactly where it didn't display correctly in Chrome (but Chrome Developer Tools showed it as I intended), but it did display in another browser.
Now, I am having an issue where multiple pages on the same site have different fonts for the same menu although the CSS showing in Inspect Element is correct for all - the behavior is consistent between Chrome and Safari (haven't checked other browsers yet).
You could always check for
!importanton lower down lines. I think that happened to me once, and I don't think it put a line through my style that was being overidden. (It may have though it was a long time ago it happened.) The only way really around that if that's the case and if that!importantis necessary is to add!importantto your rule you want to overwrite with. (Try to avoid using importants wherever possible though, because in most cases an important isn't necessary.)