Announcement

Collapse
No announcement yet.

Google Chrome 105 Released With HTML Sanitizer API, Container Queries & More

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Google Chrome 105 Released With HTML Sanitizer API, Container Queries & More

    Phoronix: Google Chrome 105 Released With HTML Sanitizer API, Container Queries & More

    Google engineers today promoted Chrome 105 to their stable channel across Linux, macOS, Windows, and Android platforms...

    https://www.phoronix.com/news/Google-Chrome-105-Stable

  • #2
    They've also added :has for everyone.
    I've been waiting for :has ever since I learnt CSS (since IE6 era in my case).
    Before :has I had to use JS, or add a backend code, or add extra CSS code.
    Code:
    /*:has(XX, YY) means "contains XX and/or YY" */
    /*:has(~ article) means "there's another <article> among next siblings".
    article:has(~ article):has(iframe, > video):has(h2):has(ul):has(:focus) ~ footer {
      display: none;
    }
    article:has(video):not(:has(iframe)) {
      background: #fff;
    }
    /* an <article> with 3 children */
    article:has(> :nth-child(3):last-child) {
    }
    article:has(> div:nth-child(1)):has(> img:nth-child(2)):has(> img:nth-child(3):last-child) 
    }
    Safari already had :has since 15.4.
    Only Firefox doesn't have :has by default, although since Firefox 103 (cur ver=104) it's been possible to enable :has in about:config layout.css.has-selector.enabled

    Comment


    • #3
      See the New in Chrome 105 article.
      Chrome 105 is rolling out now. Container queries and :has() are a match made in responsive heaven. The new Sanitizer API provides a robust processor for arbitrary strings to help reduce cross site scripting vulnerabilities. We’re taking another step towards deprecating WebSQL. And there's plenty more.

      Comment


      • #4
        Originally posted by arzeth View Post
        They've also added :has for everyone.
        I've been waiting for :has ever since I learnt CSS (since IE6 era in my case).
        Before :has I had to use JS, or add a backend code, or add extra CSS code.
        Code:
        /*:has(XX, YY) means "contains XX and/or YY" */
        /*:has(~ article) means "there's another <article> among next siblings".
        article:has(~ article):has(iframe, > video):has(h2):has(ul):has(:focus) ~ footer {
        display: none;
        }
        article:has(video):not(:has(iframe)) {
        background: #fff;
        }
        /* an <article> with 3 children */
        article:has(> :nth-child(3):last-child) {
        }
        article:has(> div:nth-child(1)):has(> img:nth-child(2)):has(> img:nth-child(3):last-child)
        }
        Safari already had :has since 15.4.
        Only Firefox doesn't have :has by default, although since Firefox 103 (cur ver=104) it's been possible to enable :has in about:config layout.css.has-selector.enabled
        That sounds fantastic, and I vaguely remember seeing it over a decade ago.

        Comment


        • #5
          Originally posted by arzeth View Post
          They've also added :has for everyone.
          I've been waiting for :has ever since I learnt CSS (since IE6 era in my case).
          Before :has I had to use JS, or add a backend code, or add extra CSS code.
          Code:
          /*:has(XX, YY) means "contains XX and/or YY" */
          /*:has(~ article) means "there's another <article> among next siblings".
          article:has(~ article):has(iframe, > video):has(h2):has(ul):has(:focus) ~ footer {
          display: none;
          }
          article:has(video):not(:has(iframe)) {
          background: #fff;
          }
          /* an <article> with 3 children */
          article:has(> :nth-child(3):last-child) {
          }
          article:has(> div:nth-child(1)):has(> img:nth-child(2)):has(> img:nth-child(3):last-child)
          }
          Safari already had :has since 15.4.
          Only Firefox doesn't have :has by default, although since Firefox 103 (cur ver=104) it's been possible to enable :has in about:config layout.css.has-selector.enabled

          you can has cheezeburgers now but will we get a phoronix benchmark ?

          Comment

          Working...
          X