Resultados da pesquisa a pedido "css-grid"
CSS Grid tem uma função flex-grow?
Existe um analógico paraflex-grow para ograde [https://developer.mozilla.org/en-US/docs/Web/CSS/grid]propriedade? Gostaria que minhas áreas de grade acomodassem o conteúdo que recebem, mas algumas áreas ocupam mais espaço do que outras ...
O CSS Grid Layout não funciona no Edge e no IE 11, mesmo com o prefixo -ms
Estou usando a seguinte marcação HTML para minha grade. <section class="grid"> <article class="grid-item width-2x height-2x">....</article> <article class="grid-item">....</article> <article class="grid-item">....</article> <article ...
Áreas de grade não dispostas corretamente no CSS Grid
Quero criar meu site usando o sistema de grade CSS, mas parece não estar funcionando. Aqui está o meu código: .grid { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; grid-template-areas: "logo faq" "about-us"; } ...
pseudo-elemento agindo como um item de grade na grade CSS
Estou criando um formulário que possui campos obrigatórios. Para marcar como necessário, estou colocando um asterisco (*) como::before elemento e flutuando-o para a direita, para que fique no canto superior direito do campo. O problema que estou ...
Como alinhar verticalmente objetos em CSS ao trabalhar com grades CSS? [duplicado]
Esta pergunta já tem uma resposta aqui: Centralização na Grade CSS [/questions/45536537/centering-in-css-grid] 5 respostasEu me deparei com esse problema recentemente. Vamos supor que eu tenho uma simples<h1> e quero centralizá-la verticalmente, ...
Centralização na Grade CSS
Estou tentando criar uma página simples com CSS Grid. O que não estou conseguindo fazer é centralizar o texto do HTML nas respectivas células da grade. Tentei colocar o conteúdo em separadodivs tanto dentro como fora daleft_bg eright_bg ...
áreas de modelo de grade com arte ASCII não está funcionando
Quando grid-template-areas: "....... header header" "sidebar content content";é alterado para: grid-template-areas: "....... header header" "sidebar header content";Tudo desmorona. Como posso obter o mesmo efeito com o layout CSS Grid? body ...
A diferença entre unidades percentuais e fr no CSS Grid Layout
Estou brincando com o CSS Grid Layout e me deparei com uma pergunta para a qual não consigo encontrar uma resposta. Considere o seguinte exemplo: :root { --grid-columns: 12; --column-gap: 10px; --row-gap: 10px; } .grid { display: grid; ...
Bug do Safari da altura da linha da grade da CSS
Eu fiz um modelo de grade com linhas de 1fr 1fr 1fr. Na linha do meio, há uma lista de imagens embutidas. No Chrome e Firefox, as imagens respeitam a altura da linha da grade e se adaptam adequadamente. No entanto, no Safari 10.1.2 e no Safari ...
Layout de alvenaria somente CSS
Preciso implementar um layout de alvenaria bastante comum. No entanto, por vários motivos, não quero usar JavaScript para fazer isso. [/imgs/Z25DI.png] Parâmetros: Todos os elementos têm a mesma larguraOs elementos têm uma altura que não ...