Categorias: CSS

Aumentar imagem e centralizar texto em blurb à esquerda

Escrito por Amanda de Lavra

26 de agosto de 2021

Editado em 09/09/2021

O módulo blurb no Divi tem diversas limitações. Uma delas é que, quando você seleciona que a imagem ou ícone deve ficar à esquerda e não no topo, a imagem fica muito pequena. Para contornar isso, é necessário ir no módulo em aba Avançado > Customize CSS > Imagem da descrição e definir a largura da imagem. Existe essa opção no construtor em Dimensionamento, mas o layout fica bagunçado quando se altera a largura lá. Outra coisa importante é definir a margem da imagem para que ela fica centralizada verticalmente no módulo:

width: 64px;
margin: auto 0;

Além disso, o texto fica alinhado em cima e não no meio do módulo. Para essa correção, é necessário ir na aba Avançado > Customize CSS > Conteúdo da descrição e adicionar:

display: flex;
align-items: center;

Posts relacionados

Customizações da página de login e painel administrativo do WordPress

Customizações da página de login e painel administrativo do WordPress

Para todo o site que eu faço, personalizo a página de login e também o wp-admin para ficar com a marca do cliente. Recentemente, aperfeiçoei o código para que o login ficasse no meio da página, tanto verticalmente quanto horizontalmente. Segue código usado aqui neste...

Botão Leia Mais no Elementor

Botão Leia Mais no Elementor

O site do cliente tinham alguns textos que eram muito extensos e, num layout de coluna, variavam muito de tamanho. Decidi adaptar o que já havia feito no Divi, ao incluir um botão Leia Mais (https://blog.amandadelavra.com.br/modulo-texto-com-botao-leia-mais/), mas...

Como manter a proporção de um elemento com CSS

Como manter a proporção de um elemento com CSS

Me pediram para colocar um elemento flutuante no site com o preço de cada produto. Como os preços variam de acordo com o produto, eu não podia ajustar com padding apenas para que ficasse redondinho na proporção 1:1. Para isso, usei a propriedade do CSS aspect-ratio....