Solucionado (ver solução)
Solucionado
(ver solução)
5
respostas

Posicionamento texto

Eu tenho 4 colunas alinhadas com flex box, quando redimensiono a tela para resoluções menores que o texto do título quebra em 2 linhas, eu gostaria que ele se alinhasse sempre ao topo, e o texto após ele também, no momento elees estão ao centro, queria os textos ao topo sempre na mesma linha e só o botão "Saiba Mais" a baixo mesmo. Segue o link: http://tipagos.tempsite.ws/site-pinbank/index.html

Desde já agradeço a quem puder me dá um help!!

5 respostas

Opa! Eai Marylia, tudo bom?

Parabéns pelo site, ficou massa demais. Sobre sua dúvida, posso tentar te ajudar. Só não consegui entender direito o que você precisa. O que está dando problema e aonde?

Fico aguardando sua reposta :)

Oi Nilton, obrigada!

Então as colunas precisam sempre seer do mesmo tamanho em qualquer tamanho de tela, e os textos sempre alinhados ao topo. Do jeito que eu consegui fazer, quando visulaizo em telas de desktop perceba que os textos não estão alinhados. Aí quando vou diminuindo para resolução Tablet por exemplo aí está do jeito que eu preciso que fique.

Marylia, não sei se vai solucionar o seu problema, mas dá uma conferida aí nas alterações que fiz.

Obs: os três pontos é o codigo que não alterei.

.servico {
    ...
    /* align-items: start; */ << remover
}

screenshot

.servico .item-servico {
....
      flex-direction: row;
     justify-content: flex-start; 
    align-items: flex-start;
    flex-wrap: wrap;
}

.bt {
    ...
    align-self: flex-end;
    margin: 0 auto;
}

screenshot do resultado

solução!

Bom dia Nilton, sim deu certo a sua versão, porém para dispositivos de menores resolução não resolveu olha: https://ibb.co/nbALtH

Mas mesmo assim eu vou guardar essa sua solução para me ajudar nas próximas.

Eu dei uma solução aqui, mantive o meu código e pra alinhar os textos eu deixei todos com o mesmo número de linhas:

http://tipagos.tempsite.ws/site-pinbank/index.html

Obrigada!! :D

Aee!! Que bom que você conseguiu resolver. :D

Até uma próxima!