hierarchical structure

CSS Styling a button does not yield the desired outcome

When trying to incorporate a new page into an existing website with corporate styling, I came to a problem which was hard to detect (for me). A newly created button should have a slightly different position and edge rounding than all other styled buttons as it comes from a different context. Whatever I've done, I never got the correct styling, like magically ignored by the browser. Learning about the developer console I digged deep into the css styling and found out that a <div> from a container forced its own styling on the button. Some changes work whereas some changes are ignored because they are overwritten by the super div. A very hacky and in general practice bad way to solve this problem was to apply the `!important` tag which then really applied the changes. Reading through some articles, my use case was actually well suited for the `!important` tag because it really stands out in the context.
Subscribe to hierarchical structure