Preciso colocar duas fotos uma ao lado da outra ,uma embaixo delas e uma no footer com 100% ,estou fazendo curso e não consigo

1 resposta
P
.corpo-titulo {

margin: 0px;

margin-top: 10px;

padding: 10px;

margin-left: 10px;

color: white;

text-transform: uppercase;

justify-content: center;

text-align: center;

font-size: 25px;

font-family: sans-serif;

background-color: red;

}

.corpo-foto {

width: 48%;

height: 48%;

margin: 1%;

}
.corpo-foto-ft{

width: 48%;
height: 48%;
margin: 1%;
}

.Fotografias {

display: flex;

width: 50%;

height: 50%;

flex-direction: column;
}

.corpo {

position: absolute;

display: flex;

margin: 50px;

flex-flow: row ;

flex-flow: wrap;

}
.rodape {

background: /<em>l(fotos/foto02.jpg) no-repeat center;</em>/

background-size: cover;

width: 100%;

height: 35vh;

justify-content: flex-end;

align-self: flex-start;

}

1 Resposta

T

Eu não entendido muito bem a sua dúvida…
Para vc encaixar uma foto ao lado da outra elas devem estar em tamanhos que caibam lado a lado, ex: use a %, poderia ser cada foto de 50%, e ambas devem conter o display:inline ou display:inline-block;

.imgens-na-linha{

width:50%;

display:inline-block;

}

.imagem-abaixo{

width:100%;

}

dicas:

  • quando estiver determinando a largura não determine a altura senão sua foto pode ficar zuada e sair “esticada”
  • se vc esta usando o display flex, para usar as imagens na mesma linha tente usar o inline-flex (tem que buscar as variações para outros navegadores, webkit, ms, o…);
  • quando vc usa o position absolute, deve verificar se o elemento pai dele tem o position relative, além disso quando um elemento esta em absolute o pai deve ter um tamanho que o suporte, já que o pai não vai levar em consideração o elemento filho para determinar o seu tamanho;
Criado 7 de novembro de 2017
Ultima resposta 16 de nov. de 2017
Respostas 1
Participantes 2