How do I detect the user’s browser and apply a specific CSS file?

by

The closest you can come with pure CSS is with feature queries. Instead of detecting the browser type/version, it allows you to check if a specific property/value combinations are supported by the browser.

The following is an example of using the transform property for vertical centering. If the browser doesn’t support transform, then we don’t want to adjust its positioning:

@supports (transform: translateY(-50%)) {
    .foo {
        position: relative;
        top: 50%;
        transform: translateY(-50%);
    }
}

Browser support for Feature Queries

More Related Contents:

  1. Detect the type of font that is displayed in an image [closed]
  2. Is there a CSS selector for elements containing certain text?
  3. Responsive css background images
  4. Any way to declare a size/partial border to a box?
  5. How can I get FF 33.x Flexbox behavior in FF 34.x? [duplicate]
  6. Add a CSS border on hover without moving the element [duplicate]
  7. Nesting CSS classes
  8. Control the dashed border stroke length and distance between strokes
  9. Scrolling a flexbox with overflowing content
  10. Font Awesome 5 – why aren’t icons like bitcoin, facebook, twitter showing?
  11. Does css hover work on mobile devices?
  12. How can I remove the outline around hyperlinks images?
  13. Text on image mouseover?
  14. Can I change the fill color of an svg path with CSS?
  15. Responsive css styles on mobile devices ONLY
  16. how to reset a CSS variable (aka custom properties) and use the fallback one?
  17. CSS rounded corners in IE8
  18. Is there such a thing as an “all inclusive sibling” CSS selector?
  19. CSS Best Practice about ID and Class?
  20. Bootstrap 4 card-deck with number of columns based on viewport
  21. What is the em font-size unit? How much is it in pixels?
  22. Change style of pseudo elements in angular2
  23. prevent children from inheriting transformation css3
  24. how to change bootstrap version 4 button color
  25. Correct terms and words for sections and parts of selectors
  26. How do I make text bold in HTML?
  27. Is it acceptable to use tables for forms? Or is it still more correct to use divs?
  28. How to use variable in CSS? [duplicate]
  29. CSS shorthand vs longhand?
  30. Latest on CSS parent selector [duplicate]

Leave a Comment