A equipe do Chrome teve uma grande participação na conferência CSS Day deste ano. Nós administramos o Helpdesk do CSS, respondendo a perguntas dos participantes, mas também tínhamos um quadro branco em que perguntávamos às pessoas o que elas achavam que ainda estava faltando no CSS. Nesta postagem, vou compartilhar os resultados dessa pergunta e pedir que você nos diga o que acha que está faltando no HTML e no CSS respondendo a esta breve pesquisa. Você concorda com os participantes do CSS Day?
As dez principais solicitações
Os participantes escreveram ideias em notas adesivas e as adicionaram ao quadro. As pessoas também podem adicionar um adesivo para votar nas ideias. Os dez principais recursos são os seguintes.
Suporte para estilização de entradas
Esse foi o recurso mais pedido, com 21 votos. Você quer maneiras de estilizar esses elementos comuns da interface de forma consistente.
Essa é uma área que conhecemos bem no Chrome, já que é um dos principais problemas para desenvolvedores. Estamos trabalhando para criar soluções melhores para eles. Por exemplo, os elementos de seleção personalizáveis buscam oferecer uma maneira de ativar um novo comportamento de estilização. Depois, você pode adicionar imagens ou um estilo mais elaborado às opções. A vantagem dessa abordagem é que ela volta para um menu de seleção comum, permitindo que seja um aprimoramento progressivo.
Oculto visualmente
Com 19 votos no CSS Day, essa foi a segunda solicitação mais popular. A solicitação é para uma maneira de adicionar conteúdo usado apenas por leitores de tela. Pode ser um elemento HTML em que o conteúdo não é mostrado, apenas lido por um leitor de tela.
Normalmente, as pessoas fazem isso criando
uma classe .visually-hidden
para ocultar o
conteúdo, mas ainda o deixar acessível aos leitores de tela.
Embora essa seja uma solicitação popular, há pessoas que não acham que isso deva ser implementado. Para mais detalhes, leia Visually hidden content is a hack that needs to be resolved, not enshrined e esta discussão sobre CSS WG issue 560 (links em inglês).
position: sticky dentro de overflow:hidden
Esta solicitação recebeu 16 votos. No momento, position: sticky só funciona quando
todos os elementos pai são overflow: visible.
Há um problema aberto de 2017 solicitando isso,
e embora o caso de uso inicial
de ativar o uso de overflow: hidden para limpar floats possa ser menos
necessário hoje, há muitos outros cenários detalhados na conversa.
Animar para height: auto
Com 12 votos, muitos participantes queriam animar para height: auto. Estamos felizes em anunciar que isso vai chegar à plataforma da Web com a propriedade interpolate-size e a função calc-size() do CSS.
Eles estarão disponíveis a partir do Chrome 129.
Aguarde uma postagem futura com mais informações sobre esses recursos.
Outros tipos de entrada
O HTML5 trouxe muitos tipos diferentes para o elemento <input>, por exemplo, type="email" para um endereço de e-mail ou type="range" para um controle deslizante de intervalo.
No CSS Day, recebemos 10 votos para mais tipos, por exemplo, intervalo duplo ou preenchimento automático com lista de dados personalizada.
Números aleatórios reais em CSS
Outra solicitação com 10 votos foi para números aleatórios reais em CSS. Isso já foi solicitado e resolvido no passado para uma animation-duration aleatória.
Classes de estilo de mixin
O CSS adicionou vários recursos vistos anteriormente em pré-processadores de CSS, como variáveis com propriedades personalizadas e agora o aninhamento de CSS. Os mixins reutilizáveis ainda não fazem parte da linguagem, mas sete participantes do CSS Day queriam que eles fossem incluídos.
Houve uma resolução do grupo de trabalho do CSS para começar a trabalhar em uma especificação para esse recurso. Você pode adicionar suas ideias e casos de uso à discussão nesse problema.
Estilos globais no shadow DOM
Outro problema que tem uma grande discussão de casos de uso é a solicitação para permitir que estilos CSS globais sejam aplicados em um Shadow DOM. Seis pessoas pediram isso no CSS Day. Isso permitiria que os estilos de redefinição global também fossem aplicados em componentes da Web e que arquivos CSS únicos funcionassem em todos os componentes de um site. Confira este resumo de casos de uso e diga se você também gostaria de ter esse recurso.
Dividir unidades mistas
Houve uma proposta para o Interop 2024
solicitando a
capacidade de dividir por unidades mistas, por exemplo, calc(100vw / 1px). No entanto, muitos desenvolvedores, incluindo seis pessoas no CSS Day, gostariam de ver isso implementado.
nth-letter
O CSS tem vários pseudoelementos que agem como se você tivesse envolvido um span em
alguma seção de conteúdo. Por exemplo, o pseudoelemento
::first-letter
segmenta a primeira letra da primeira linha do contêiner de bloco
em que ele é aplicado.
::nth-letter não está nessa lista, e você pede ::nth-letter há cerca de 20 anos. Sabemos que esse é um pedido antigo dos desenvolvedores da Web. No CSS Day, seis pessoas votaram nesse recurso, o que o colocou em último lugar no nosso top 10.
Você concorda com o top 10 do CSS Day?
Gostaríamos de saber a opinião de um público mais amplo sobre esses problemas. Algum deles está entre os dez mais importantes para você? Se não, há algo mais que você gostaria de ver em CSS e HTML? Preencha este formulário curto e vamos resumir as respostas em outra postagem.