Use new selectors responsibly with selector queries

Поделиться
HTML-код
  • Опубликовано: 27 янв 2025

Комментарии • 19

  • @BennyPowers
    @BennyPowers 5 лет назад +21

    Thanks for the review, I love these Mozilla design explainers, please keep them coming.
    My three-year-old daughter asked "is that your friend?" I said "that's my teacher" 😁

  • @BJ-bd5fc
    @BJ-bd5fc 11 месяцев назад +1

    This video is fairly old, but still very informative. If only every explanatory video were as well-done as these Mozilla Developer videos...

  • @Ana-mn5io
    @Ana-mn5io 4 года назад +1

    The more I see the less I know ♪,...
    I just found u Miriam, and u are an inspo for me !
    thank u for this! ♥

  • @nikkimoreaux
    @nikkimoreaux 5 лет назад +1

    Thanks for all the work done at Mozilla ! 🦖💖
    And thank you a lot for this YT channel, these CSS videos are great !

  • @xaddict
    @xaddict 5 лет назад +17

    It would be an amazing addition to the developer tools if there was a way to disable support for certain features. For example, disable display: grid so I can check what the fallback looks like without actually having to comment out all that code just to test.

    • @syrupcore
      @syrupcore 5 лет назад

      I really liked this idea on first read but thinking it might produce false confidence. Prolly best to test in the browser that doesn't support featureX directly.

    • @xaddict
      @xaddict 5 лет назад

      syrupcore the thing is, sometimes it’s pretty hard to get those browsers installed. Earlier versions of browsers mostly auto-update

  • @carolmckay5152
    @carolmckay5152 5 лет назад +1

    Thank you for this scary yet very informative video.

  • @12ty
    @12ty 5 лет назад +1

    Suuuper useful information. Thank-you.

  • @jimbo2150
    @jimbo2150 5 лет назад +1

    Not sure it's a good thing to rely on that fallback for Safari. That browser does not yet support the @supports selector() function. However, if the next version does add support for the selector() function, but not the content attribute within a ::marker selector, your fallback will still add the padding to the list elements even when they are still showing numbers. Is there a way to test a selector with an attribute? Something like @supports selector(::marker) (content: "") { ... } which should check to see if ::marker pseudo-element is supported and that content attribute is supported within a ::marker pseudo-element?

  • @yacinetouati2378
    @yacinetouati2378 5 лет назад

    great demo ! thanks :)

  • @sashatv138
    @sashatv138 4 года назад

    Thank you!

  • @BradenKelley
    @BradenKelley 5 лет назад

    It would be really cool if there was a way to check that a property inside a selector were supported. In this example safari supports ::marker and supports content: '✅' in some things like :after, but doesn't support content: '✅' inside ::marker.
    Do you know if there is anything in the works where you could say something like this?
    ::marker {
    color: red;
    font-family: cursive;
    }
    @supports (content: '✅') within selector(::marker) {
    ::marker {
    content: '✅';
    }
    li {
    padding-left: 0.5em;
    }
    }

  • @Vaeshkar
    @Vaeshkar 5 лет назад +2

    Defragmentation for my brain to make more room for these series. Also canceled my Netflix account.

  • @qam44
    @qam44 5 лет назад

    Really nice and short explained. But in my opinion there is no sense to use at this moment, we have to wait for better suport from other browsers.

  • @suspendedhatch
    @suspendedhatch 5 лет назад

    Why are there no jobs for HTML CSS? They're not valued as much as database languages or even a CMS.

  • @sergiomartin8935
    @sergiomartin8935 5 лет назад

    Congratulations. You have improved tremendously as a evangelist in just very few time. I like your style as much as Jen Simmons (which of course is different)

  • @apina2
    @apina2 2 года назад

    You sound very manly 😄