Relative units for sizes, margins and paddings of the main navigation #377
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This should result in a size of 12px in the most browsers as before. But unlike before, everything adapts to the sizes specified in the visitor's browser. Signed-off-by: Heiko August <[email protected]>
… height definition Signed-off-by: Heiko August <[email protected]>
…adding-inline Changed it thereby from 3px on each side to 0.25em. Signed-off-by: Heiko August <[email protected]>
Signed-off-by: Heiko August <[email protected]>
…t 0.5em Signed-off-by: Heiko August <[email protected]>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This is the next step in the chain to replace pixel based sizes with relative units. With this pull request I reworked the main navigation.
The font size is set to 75% of the browsers default font size (with
0.75em). In most cases the default font size is 16px and therefore the font size of the main navigation will be 12px as before. But with larger font sizes in the browser the font size will grow relative to the setting. As in the previous pull requests #374 and #376 I set the border radius size to 0.5em to make them uniform.The height and min-height of the navigation bar was replaced by a proper line height of 2.75em. On one hand this looks the same as before (with a browser default font size of 16px) on the other it makes it possible to be flexible with different defaults and also to have an additional text line in case of additional menu points without breaking the layout.