Evite quebras de linha com CSS

- truque css em um componente Reactt

Contanto que a estrada esteja certa, você não tem medo da estrada distante - 只要 路 是 对 的 , 就 不怕 路 远

Recentemente, encontrei um problema interessante, digamos, há alguns itens de lista para exibir usando o código React básico como abaixo 👇

um muito simples
  • …

✨ Observe que esses itens devem estar lado a lado (em linha e, claro, sem quebras de linha ) como o resultado abaixo👇

visualização de listas responsivas

Eu escrevi alguns css simples: ✏️

Quero que os itens estejam lado a lado 👉exibir: embutido

E o resultado foi 💥

Ops, quebras de linha 🙅‍♀️

Veja as quebras de linha ? Feio o suficiente ...

🤞 Aí vem minha solução simples:

evitar quebras de linha

É isso! 🌸

A white-spacepropriedade CSS define como o espaço em branco dentro de um elemento é tratado, ele recolhe o espaço em branco, mas não permite o empacotamento.

A overflowpropriedade abreviada do CSS define o comportamento desejado para o estouro de um elemento - ou seja, quando o conteúdo de um elemento é muito grande para caber em seu contexto de formatação de bloco - em ambas as direções.

A text-overflowpropriedade CSS define como o conteúdo de estouro oculto é sinalizado para os usuários. Ele pode ser cortado, exibir reticências (' …') ou exibir uma string personalizada.

Esse foi um truque rápido e simples de CSS, espero que gostem! 💫

Obrigado por ler!

Suggested posts

Evitando as consequências devastadoras de um derrame: aprendendo com a jornada de uma família.

Evitando as consequências devastadoras de um derrame: aprendendo com a jornada de uma família.

Introdução O AVC é uma emergência médica que pode atingir qualquer pessoa a qualquer momento. Ocorre quando o fluxo sanguíneo para uma parte do cérebro é interrompido, levando a uma perda repentina da função cerebral.

Folha de Estilo do Café: Café como uma Cor

Neste infográfico bobo, imagino como o café poderia ser expresso se representado de forma semelhante às cores CSS.

Folha de Estilo do Café: Café como uma Cor

Eles dizem que os desenvolvedores poderiam trabalhar apenas para o café. Não acho que isso seja verdade (mas talvez também não muito).

Related posts

O que você pode fazer em sua temporada de espera (esperando para conseguir seu primeiro emprego em tecnologia)

O que você pode fazer em sua temporada de espera (esperando para conseguir seu primeiro emprego em tecnologia)

Mudar para uma nova carreira pode ser extremamente desafiador se você tentar fazer isso sozinho. É importante encontrar parceiros de responsabilidade que estejam no mesmo nível de aprendizado que você, que compartilhem objetivos, tenacidade e motivação semelhantes.

3 maneiras comprovadas de melhorar sua habilidade de escrita

Os benefícios de escrever e estratégias para ajudá-lo a fazê-lo

3 maneiras comprovadas de melhorar sua habilidade de escrita

Em 2022, com o lançamento do GPT-3, a habilidade de escrita parece se tornar menos importante. Com a IA, pessoas com redação ruim também podem gerar funcionários de qualidade.

Rede de TV Twitter

Rede de TV Twitter

O que é velho agora é novo de novo e o que costumava ser a coisa brilhante e brilhante agora parece opaco. Não estou falando de jeans JNCO fazendo um retorno entre os garotos legais do centro da cidade junto com outras modas do final dos anos 1990.

A lenta erosão: revelando como as pessoas desperdiçam em suas carreiras

A lenta erosão: revelando como as pessoas desperdiçam em suas carreiras

No mundo acelerado e competitivo de hoje, a carreira desempenha um papel significativo no crescimento pessoal, na estabilidade financeira e na satisfação geral com a vida. No entanto, muitos indivíduos encontram-se presos em um ciclo implacável de estagnação e insatisfação, definhando gradualmente em suas vidas profissionais.