Style is completely messed because of margin-inline-start style - Adding PostCSS "Autoprefixer" plugin can solve it

[fzyzcjy]

Hi thanks for the template! I see style is completely messed because of margin-inline-start style - it is not implemented in this mobile phone. Adding PostCSS "Autoprefixer" plugin can solve it, by automatically prefixing with suitable vendor prefixs

[alex-shpak]

Hi! What browser is that?
Unfortunatelly adding PostCSS will require to install it n addition to hugo binary, this is something that I try to avoid 🤔

[fzyzcjy]

A browser in an old android phone.
Hmm that is a problem...

[chrillek]

It might be possible to use a @supports:

@supports(margin-inline-start: -16em) {
  .book-menu {
    margin-inline-start: ...
  } 
}
@supports not(margin-inline-start: -16em) {
  .book-menu {
   ... something else ...
 }
}

Alternatively, include the prefixed versions in the style itself.
The main reason for using this over margin-left is that it accounts for rtl scripts. OTH, it is only available since 2018 and has been in Safari only since April 2021. So it might be a bit recent for some use-cases?