Can I use... Support tables for HTML5, CSS3, etc

<!doctype html> <html dir="ltr" lang="en-US" class="no-js"> <head> <meta charset="utf-8" /> <title>Can I use... Support tables for HTML5, CSS3, etc</title> <meta name="viewport" content="width=device-width"> <link rel="alternate" type="application/atom+xml" title="Can I Use updates" href="/feed"> <link href="//fonts.googleapis.com/css?family=Inconsolata&display=swap" rel="stylesheet"> <link rel="icon" href="/img/favicon-128.png" sizes="16x16 32x32 64x64 128x128" type="image/png"/> <link rel="apple-touch-icon" href="/img/favicon-128.png"> <link rel="stylesheet" href="/css/main.css?1730439433" media="all"> <link rel="stylesheet" href="/css/home.css?1730439432" media="all"> <link rel="stylesheet" data-theme="light" href="/css/theme-light.css?1730439433" media="all"> <link rel="stylesheet" data-theme="dark" href="/css/theme-dark.css?1730439433" media="(prefers-color-scheme: dark)"> <meta name="Description" content=""Can I use" provides up-to-date browser support tables for support of front-end web technologies on desktop and mobile web browsers."> <meta name="keywords" content="web browser compatibility support html css svg html5 css3 opera chrome firefox safari internet explorer"> <link rel="search" href="/opensearch.xml" type="application/opensearchdescription+xml" title="Can I use"/> <link rel="preconnect" href="https://ipinfo.io"> <link rel="preconnect" href="https://www.google-analytics.com"> <base href="/" /> <script> document.write('<style>.static-only {display:none}</style>'); </script> <script async src="https://www.googletagmanager.com/gtag/js?id=G-8SCDSGDGKM"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-8SCDSGDGKM'); </script> <script> (function() { if (!window.customElements) { var s = document.createElement('script'); s.src = '/legacy-handler.js'; document.getElementsByTagName('head')[0].appendChild(s); } }()); </script> <script defer src="js-data/data.js?1732430797"></script><script defer src="js/bundle.js?1730439434"></script></head> <body class="is-home"> <div id="main" class="ciu-main-wrap"> <header class="ciu-page-header"> <nav role="navigation" id="tab-container"> <ul class="ciu-page-header__primary-nav"> <li class="site-nav-item js-site-nav"><a href="/" data-route="home">Home</a></li> <li class="site-nav-item js-site-nav site-nav-item--news"><a href="/ciu/news" data-route="news">News</a></li> </ul> <ul class="ciu-page-header__secondary-nav"> <li class="site-nav-item js-site-nav site-nav-item--comparison"><a href="/ciu/comparison" data-route="comparison">Compare<span class="site-nav__extra-text"> browsers</span></a></li> <li class="site-nav-item js-site-nav site-nav-item--last "><a href="/ciu/about" data-route="about">About</a></li> </ul> <a class="news js-news" data-newstime="1712448000" href="https://caniuse.com/wasm-bigint,wasm-bulk-memory,wasm-multi-value,wasm-mutable-globals,wasm-nontrapping-fptoint,wasm-signext,wasm-simd,wasm-threads"><span class="date">April 7, 2024 -</span> 8 new features</a> </nav> <section class="ciu-search"> <div class="ciu-search__inner js-search"> <a href="/" class="ciu-search__label">Can I use</a> <form action="/" class="ciu-search__form"> <label class="ciu-search__a11y-label" for="feat_search">Search</label> <input type="text" class="ciu-search__input" id="feat_search" name="search" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" autofocus value=""> <input type="hidden" name="static" value="1"> </form> ? <button class="options-toggle js-options-toggle"> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" class="icon"> <path d="M16,8.87V7L15.74,7l-1.95-.64-.52-1.25,1-2.12L13,1.67l-.25.12-1.82.93L9.66,2.2,8.87,0H7.05L7,.26,6.33,2.21l-1.25.52L3,1.73,1.67,3l.12.25.93,1.82L2.2,6.34,0,7.13V8.95L.26,9l2,.64.52,1.25L1.73,13,3,14.33l.25-.12,1.82-.93,1.26.52L7.13,16H8.95L9,15.74l.64-2,1.26-.52,2.11,1L14.33,13l-.12-.25-.93-1.82.52-1.26ZM8,10.55A2.55,2.55,0,1,1,10.55,8,2.55,2.55,0,0,1,8,10.55Z"/> </svg> <span> Settings </span> </button> </div> <div class="search-result-info js-search-result-info hidden"></div> </section> </header> <main class="ciu-page-content js-content" data-static-id="home"> <section class="section__home clearfix" id="home"> <h3 class="ciu-section-heading hidden-from-screen">Home</h3> <div class="home__index-strip js-index-strip"> <a href="/ciu/index">Index of features</a> </div> <div class="home-sections"> <div class="home__section home__section--latest"> <h4 class="home__subheading">Latest features</h4> <ol class="home__list js-latest-features"> <li class="home__list-item"><a href="/wasm-bigint">WebAssembly BigInt to i64 conversion in JS API</a></li> <li class="home__list-item"><a href="/wasm-threads">WebAssembly Threads and Atomics</a></li> <li class="home__list-item"><a href="/wasm-multi-value">WebAssembly Multi-Value</a></li> <li class="home__list-item"><a href="/wasm-mutable-globals">WebAssembly Import/Export of Mutable Globals</a></li> <li class="home__list-item"><a href="/wasm-nontrapping-fptoint">WebAssembly Non-trapping float-to-int Conversion</a></li> </ol> </div> <div class="home__section home__section--most-searched"> <h4 class="home__subheading">Most searched features</h4> <ol class="home__list home__list--numbered js-most-searched"> <li class="home__list-item"><a href="webp">WebP image format</a></li> <li class="home__list-item"><a href="flexbox">Flexbox</a></li> <li class="home__list-item"><a href="flexbox-gap">gap property for Flexbox</a></li> <li class="home__list-item"><a href="css-grid">CSS Grid</a></li> <li class="home__list-item"><a href="webgl">WebGL</a></li> </ol> </div> <div class="home__section home__section--browserstack is-static"> <h4 class="home__subheading">Test a feature</h4> <p class="home__p"> Our partnership with <a href="https://www.browserstack.com?ref=caniuse-source&caniuse_source=brand-asset&utm_source=caniuse&utm_medium=partnered&utm_campaigncode=701OW000008y9C1YAI">BrowserStack</a> now lets you test your website for compatibility across 2,000+ real browsers and devices. </p> <p class="home__p"> Test on: <div class="home__col-wrap"> <ul class="home__list"> <li class="home__list-item"> <a href="https://live.browserstack.com/#os=Windows&os_version=8.1&browser=IE&browser_version=11.0&start=true&ref=caniuse-source&source=landing_page&utm_source=caniuse&utm_medium=partnered&utm_campaigncode=701OW000008y9C1YAI"> IE 11 </a> </li> <li class="home__list-item"> <a href="https://live.browserstack.com/#os=OS+X&os_version=Sonoma&browser=Safari&browser_version=17.3&device_browser=chrome&ref=caniuse-source&source=landing_page&start=true&utm_source=caniuse&utm_medium=partnered&utm_campaigncode=701OW000008y9C1YAI"> Safari 17 </a> </li> </ul> <ul class="home__list"> <li class="home__list-item"> <a href="https://live.browserstack.com/#os=iOS&os_version=16.0&device_browser=safari&device=iPhone+14&start=true&ref=caniuse-source&source=landing_page&utm_source=caniuse&utm_medium=partnered&utm_campaigncode=701OW000008y9C1YAI"> Safari on iPhone 14 </a> </li> <li class="home__list-item"> <a href="https://live.browserstack.com/#os=android&os_version=13.0&device=Samsung+Galaxy+S23&device_browser=chrome&ref=caniuse-source&source=landing_page&start=true&utm_source=caniuse&utm_medium=partnered&utm_campaigncode=701OW000008y9C1YAI"> Chrome on Galaxy S23 </a> </li> </ul> </div> </div> <div class="home__section home__section--dyk is-static"> <h4 class="home__subheading">Did you know?</h4> <ciu-button size="small" variant="text" class="home__next-dyk-button js-next-dyk">Next</ciu-button> <ul class="home__dyk-list js-dyk-list"> <li class="home__list-item"> <p class="home__p"> If a feature you're looking for is not available on the site, you can <a href="https://github.com/fyrd/caniuse/issues">vote to have it included</a>. Better yet, if you've done the research you can even <a href="https://github.com/Fyrd/caniuse/blob/main/CONTRIBUTING.md#adding-a-feature">submit it yourself</a>! </p> </li> <li class="home__list-item"> <p class="home__p"> You can import usage data from your <b>Google Analytics</b> account and see exactly how well a feature is supported among your own site's visitors. Look under the <b class="show-settings js-show-settings">Settings panel</b> to get started! </p> </li> <li class="home__list-item"> <p class="home__p"> Usage data for all countries and continents can be imported via the <b class="show-settings js-show-settings">Settings panel</b>. </p> </li> <li class="home__list-item"> <p class="home__p"> By default, older browser versions are only shown if they have >= 0.5% usage share. You can increase or decrease this value from the <b class="show-settings js-show-settings">Settings panel</b>. </p> </li> <li class="home__list-item"> <p class="home__p"> Each feature support table includes a "Usage relative" button. This will resize each browser version cell to be relative to the amount of support it has for the selected usage source. </p> </li> </ul> </div> <div class="home__section home__section--third-party"> <h4 class="home__subheading">Third party tools</h4> <ol class="home__list"> <li class="home__list-item"> <a href="https://caniuse.bitsofco.de/">The CanIUse Embed — Add support tables to your site</a> </li> <li class="home__list-item"> <a href="https://github.com/una/caniuse-component">Caniuse Component — Add support tables to your presentations</a> </li> <li class="home__list-item"> <a href="https://github.com/sgentle/caniuse-cmd">Caniuse command line tool </a> </li> <li class="home__list-item"> <a href="https://github.com/anandthakker/doiuse">Doiuse...? — Lint your CSS to check what features work</a> </li> <li class="home__list-item"> <a href="http://iwanttouse.com">I want to use — Select multiple features and see what % of users can use them</a> </li> </ol> <p class="home__p"><a href="https://github.com/Fyrd/caniuse/wiki/Third-party-tools" class="external-link">See full list</a></p> </div> <div class="home__section home__section--browser-scores"> <h4 class="home__subheading">Browser scores</h4> <ol class="home__list js-browser-scores"> <li class="home__list-item" data-score-json="{"featCount":488,"current":{"name":"Chrome 131","full":435,"partial":25},"latest":{"name":"Chrome 134","full":435,"partial":25}}"> <span class="home__browser-bar home__browser-bar--full browser-bg--chrome" title="Full support: 435pts" style="width: 89.1%;">Chrome 131: 435</span><span class="home__browser-bar home__browser-bar--partial browser-bg--chrome" title="Partial support: 25pts" style="width: 5.1%;"></span></li> <li class="home__list-item" data-score-json="{"featCount":488,"current":{"name":"Firefox 132","full":414,"partial":24},"latest":{"name":"Firefox 135","full":415,"partial":23}}"> <span class="home__browser-bar home__browser-bar--full browser-bg--firefox" title="Full support: 414pts" style="width: 84.8%;">Firefox 132: 414</span><span class="home__browser-bar home__browser-bar--partial browser-bg--firefox" title="Partial support: 24pts" style="width: 4.9%;"></span></li> <li class="home__list-item" data-score-json="{"featCount":488,"current":{"name":"Safari 18.1","full":406,"partial":30},"latest":{"name":"Safari TP","full":411,"partial":30}}"> <span class="home__browser-bar home__browser-bar--full browser-bg--safari" title="Full support: 406pts" style="width: 83.2%;">Safari 18.1: 406</span><span class="home__browser-bar home__browser-bar--partial browser-bg--safari" title="Partial support: 30pts" style="width: 6.1%;"></span></li> </ol> </div> <div class="home__section home__section--similar"> <h4 class="home__subheading">Other support sites</h4> <ol class="home__list"> <li class="home__list-item"> <a href="https://caniemail.com">Can I email... — Support tables for HTML & CSS in emails</a> </li> <li class="home__list-item"> <a href="https://a11ysupport.io">Accessibility Support — Support information for web accessibility features in assistive technologies</a> </li> <li class="home__list-item"> <a href="https://caniwebview.com">Can I Webview — Documentation for WebView capabilities, limitations & features</a> </li> </ol> </div> </div> </section> </main> <aside class="bottom-ad"> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>  <ins class="adsbygoogle" style="display:inline-block;width:728px;height:90px" data-ad-client="ca-pub-3347535679733957" data-ad-slot="1205929339"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </aside> <footer class="ciu-footer"> <div class="footer__section footer__primary"> <h3 class="footer__heading">Can I use...</h3> <p class="site-description">Browser support tables for modern web technologies</p> <p>Created & maintained by <a class="external-link" href="https://front-end.social/@fyrd">@Fyrd</a>, design by <a class="external-link" href="https://mastodon.world/@lensco">@Lensco</a>.</p> <p>Support data contributions by the GitHub <a class="external-link" href="https://github.com/Fyrd/caniuse/graphs/contributors">community</a>. <p id="usage_note"> Usage share statistics by <a class="external-link" href="http://gs.statcounter.com/">StatCounter GlobalStats</a> for October, 2024 </p> <p>Location detection provided by <a class="external-link" href="//ipinfo.io">ipinfo.io</a>. </p> <p> Browser testing done via <a class="external-link" href="https://www.browserstack.com?ref=caniuse-source&caniuse_source=brand-asset&utm_source=caniuse&utm_medium=partnered&utm_campaigncode=701OW000008y9C1YAI" target="_blank"> <img src="/img/browserstack.svg" alt="BrowserStack" width="140" height="28" loading="lazy"> </a> </p> </div> <div class="footer__section footer__patreon"> <h3 class="footer__heading">Support via Patreon</h3> <p>Become a caniuse Patron to support the site and disable ads for only $1/month!</p> <div class="patreon-button"> <a href="https://www.patreon.com/join/caniuse"> <img src="/img/become_a_patron_button.png" width="163" height="38" alt="Become a Patron!" loading="lazy"> </a> </div> <p> or <a class="external-link" href="http://www.patreon.com/oauth2/authorize?response_type=code&client_id=efdd32564c7459c2c0dcd644b984e6948070b23b72961a3b9fb32ab3ad797184&redirect_uri=https%3A%2F%2Fcaniuse.com">Log in</a> </p> </div> <div class="footer__section footer__links"> <h3 class="footer__heading">Site links</h3> <ol class="footer__list"> <li class="footer__list-item"> <a href="/">Home</a> </li> <li class="footer__list-item"> <a href="/ciu/index">Feature index</a> </li> <li class="footer__list-item"> <a href="/usage-table">Browser usage table</a> </li> <li class="footer__list-item"> <a href="/issue-list">Feature suggestion list</a> </li> <li class="footer__list-item"> <a href="https://github.com/fyrd/caniuse">Caniuse data on GitHub</a> </li> </ol> </div> <div class="footer__section footer__legend"> <section class="ciu-legend js-legend"> <h2 class="ciu-legend__header">Legend</h2> <ul class="ciu-legend__list"> <li class="ciu-legend__item"> <span class="y ciu-legend__color">Green</span> <span class="ciu-legend__symbol">✅</span> = Supported </li> <li class="ciu-legend__item"> <span class="n ciu-legend__color">Red</span> <span class="ciu-legend__symbol">❌</span> = Not supported </li> <li class="ciu-legend__item"> <span class="a ciu-legend__color">Greenish yellow</span> <span class="ciu-legend__symbol">◐</span> = Partial support </li> <li class="ciu-legend__item"> <span class="u ciu-legend__color">Gray</span> <span class="ciu-legend__symbol">﹖</span> = Support unknown </li> </ul> </section> </div> </footer> </div> </body> </html>

CINXE.COM

Can I use... Support tables for HTML5, CSS3, etc