1
The idea is that I have a flexbox with two images that are links to other pages html. But when I create what becomes flexible are the hyperlinks and not the images. The code I’m using is this.
body{
margin: 0;
padding: 0;
box-sizing: border-box;
background-color: #02010a;
}
.container_img_secundarias{
background-color: blue;
width: 90%;
margin: 0 auto;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-evenly;
}
.container_img_secundarias img{
width: 45%;
flex-basis: 500px;
margin: 20px 30px;
}<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0">
<link rel="stylesheet" href="css/estilos.css">
<title>Minhas fotografias</title>
</head>
<body>
<div class="container_img_secundarias">
<a href="#"><img id="africa" src="imagens/africa.jpg" alt="África" title="África"></a>
<a href="#"><img id="coniferas" src="imagens/conifers.jpg" alt="Coníferas" title="Coníferas"></a>
</div>
</body>
</html>What I thought I’d do is this:
Since the images are links and items from container flexbox . Then they would have a row wrap so that the second image goes to the bottom line when necessary.
What do you mean by "flexible image" how do you want the image to behave within the link? Get an image of the final layout you want? If yes, include her in the question
– hugocsl
I put the image of what I want to do.
– Durvalnp