Totally agree with here regarding inherit: But I differ in the values you're proposing. Totally agree on removing font in favor of more specific properties. padding can impossibly clip the text, an explicit height I was waiting to have some time to tackle this, but needed to iron some things.therefore padding can be applied to one low specific selector as a base style, selectors for height need to be unnecessarily specific.padding is ignored by checkboxes and radio buttons, height is not.I was not looking for an alternative to padding, which works just fine and is much more flexible than height: Since I don't know how this could possibly be done, I am all for line-height: normal coming back, because this makes inputs look quite consistent across browsers. So, ideally, IE would expand the box of inputs with growing (inherited) line-height. inputs do require this normalization (except there's a better way to make IE inherit line-height like the other browsers). I was just substantiating the progress of this issue with a related issue (in my opinion) and example, i.e. Line-height: normal /* If indeed requires normalization */ Until the recent removal of input, this worked great.īut what we're suggesting here is to include that style IE applies padding on inputs just like any other browser. I'm not using it to fix the issue with IE. And of course, it's commonly being used in CSS reset frameworks.Using padding (and a unitless line-height on the body element) as basics in the author stylesheet to get the basic look I want, which is not unusual, I believe. It's entirely up to you when to use it, for instance you might want to use tag for the site logo in the home page, and you probably want to make it look no difference than it appears on other pages. In the 2nd group: It forces those elements to inherit those values from body by using font: inherit.
However, for the input element, it doesn't inherit any of those values, since it's a replaced element and serves its unique purpose. In the 1st group: you can see there are some special style set by default from the browser, h1 is bolder and larger it also inherits the relevant values from body automatically. MDNīy using font: inherit, it tells an element to inherit those relevant values from its parent container. The font CSS property is either a shorthand property for setting font-style, font-variant, font-weight, font-size, line-height, and font-family or a way to set the element's font to a system font, using specific keywords. It has gained popularity and often applied routinely. So this is about a particular methodology (or, as some people might say, ideology or religion) of authoring and design. Using CSS Reset, or specifically font: inherit means that on browsers supporting the inherit value, all such elements are rendered in copy text font, unless otherwise specified in a style sheet. Several HTML elements have a default rendering in browsers as regards to font properties: headings, form fields, table header cells, some phrase elements, etc. Instead, I pick the right element-whether it’s strong or em or b or h3 or whatever-and then style it as needed.” With the reset in place, I don’t pick strong because the design calls for boldfacing. First, it makes me think just that little bit harder about the semantics of my document. But Meyer links to a previous post of his where he explains the idea, saying, among other things: “I want all this because I don’t want to take style effects for granted. The overall rationale is said to be “to reduce browser inconsistencies in things like default line heights, margins and font sizes of headings, and so on”. The original Reset CSS by Eric Meyer has font:inherit. The declaration font:inherit is used in many “CSS Reset” stylesheets, which have often been copied into various libraries and frameworks.
0 kommentar(er)
