Menu
-webkit-padding-start: 40px; for Chrome
What it is for IE and Firefox?
386
There's no real right or wrong, but as a rule of thumb: For anything you want a certain, fixed size, use PX. For anything you want to scale with font-size, use EM. For anything you want to scale to the available space in the window/container, use %
Percentage(%) unit It is relative to its parent element. Percentage is primarily associated with height and width of an element, but can be used anywhere where CSS length units are allowed. Percentage is one of the most useful units for creating a responsive or fluid layout.
The em size is relative to the font size on the element in question. This can make ems a little tricky to use. If elements are nested or appear in different contexts in your document you can find that text or elements sized with ems can appear much smaller or larger than you imagined.
The fit-content behaves as fit-content(stretch) . In practice this means that the box will use the available space, but never more than max-content . When used as laid out box size for width , height , min-width , min-height , max-width and max-height the maximum and minimum sizes refer to the content size.
For Firefox, the property name is -moz-padding-start. For IE, there is no counterpart (so far).
You can achieve the same effect using widely supported CSS features at least in a simple scenario where the page as a whole is either in left-to-right or in right-to-left layout and writing direction. Using <html dir=ltr> or <html dir=rtl>, respectively, you can write your CSS code like this:
[dir=ltr] .foo {
padding-left: 2.5em;
}
[dir=rtl] .foo {
padding-right: 2.5em;
}
This would correspond to .foo { padding-start: 2.5em; }. Of course, this approach means some duplication of code. But it works on almost 100% (including IE 7 and newer in Standad Mode).
189
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
