Resumo

  • O primeiro rascunho público do W3C, de junho de 2023, permitiu que um elemento posicionado usasse a localização e o tamanho de uma âncora em outro ponto da página, com alternativas para quando a posição favorita transborda.
  • Os textos de 2024 desenvolveram a escolha da âncora padrão e a família position-try: o site lista os lugares aceitáveis, e o navegador mede qual cabe no espaço disponível.

Uma ficha de inscrição pede um dado difícil. Ao lado do campo há um botão de ajuda, uma promessa de explicação curta. O leitor toca nele e espera a resposta ali mesmo. Num monitor largo, a resposta à direita do botão fica bonita. No celular, o botão pode estar tão perto da margem que o balão manda metade da frase para fora da tela. O site preservou a proximidade geométrica em sua ideia inicial e perdeu a utilidade no resultado. Alguém abre mais uma vez a gaveta dos números top, left e compensações que funcionaram apenas no tamanho anterior.

O primeiro rascunho público de CSS Anchor Positioning, publicado pelo W3C em 29 de junho de 2023, descreveu uma relação mais direta. Um elemento posicionado pode se alinhar e dimensionar em relação a um ou mais elementos âncora em outro lugar da página. anchor-name nomeia o ponto de referência; anchor() e anchor-size() usam sua posição e suas dimensões. O balão continua sendo uma caixa própria, mas sabe qual botão deve acompanhar. Quando o texto acima quebra linha e empurra o botão para baixo, a referência acompanha a mudança.

O navegador já conhece a geometria das duas caixas porque precisa desenhá-las. O editor do site decide qual campo receberá ajuda, o que a ajuda dirá e onde prefere colocá-la. A medição comum pode ficar com o sistema de layout. Isso poupa cada página de construir uma pequena fábrica de fita métrica, embora a escolha editorial continue: direita, esquerda, acima ou abaixo são experiências diferentes para quem lê.

Quando a borda aparece, a preferência precisa de um plano B. O rascunho de junho de 2023 descreveu position-fallback e um bloco @position-fallback de regras candidatas. Se a primeira colocação transbordar o bloco contêiner, o navegador testa as seguintes até encontrar uma que caiba. O site escreve o cardápio; o navegador confere a mesa. Um balão que tenta a direita e depois a esquerda obedece a uma ordem publicada antes de o botão se aproximar da margem.

O rascunho de 14 de março de 2024 tornou mais explícita a âncora padrão com position-anchor. Para as alternativas, usou uma família chamada position-try, com position-try-options, position-try-order e uma forma abreviada. O balão ainda precisava ficar perto do botão e dentro da página. Mudava a gramática com que o autor enumerava as escolhas. Até a norma precisou experimentar nomes antes de descobrir onde eles se encaixavam.

O texto de 26 de março de 2024 continuou trabalhando na busca da âncora e nas posições de escape. Pense numa nota lateral em uma reportagem longa. Ela deve apontar para a frase que explica. Se a frase fica na beirada, a nota pode ocupar o outro lado; o leitor ainda precisa reconhecer o par. O editor seleciona posições que preservem essa relação. O navegador mede quais não transbordam o espaço disponível. Sentido editorial e geometria fazem cada um seu serviço.

No rascunho de 4 de outubro de 2024, apareceu position-try-fallbacks para as alternativas. Em 2023, a redação era position-fallback; em março de 2024, position-try-options. Cada nome pertence ao texto datado que o empregou. A troca mostra uma parte pouco glamourosa e bastante útil da história da web: encontrar uma maneira de dizer “tente outra cadeira” que o autor consiga escrever e o navegador consiga executar. Uma posição preferida não resolve o encontro com todas as bordas; uma lista pensada com cuidado pode resolver.

O histórico de publicações do W3C reúne o primeiro texto de 2023 e as revisões de 2024. Neles, o navegador assume a medida da âncora, do balão e das opções fornecidas. O site mantém a escolha do controle, da frase e da ordem de posições aceitáveis. O leitor recebe uma resposta completa ao lado da pergunta certa. Quando não há espaço à direita, existe uma segunda cadeira à esquerda.

A fita métrica volta para a gaveta. O balão finalmente pode se ocupar de explicar.