I want to create this effect but with javascript not in pure css as he did. And no scss also just css It’ll be good. codepen
.picture-container {
display: flex;
flex-flow: row nowrap;
justify-content: center;
justify-self: center;
align-items: center;
width: 40%;
height: 100vh;
}
.picture-frame {
display: flex;
flex-flow: row nowrap;
justify-content: center;
align-items: center;
padding: 5%;
border: solid 1px #000;
}
.picture {
z-index: 1;
width: 100%;
height: 100%;
}
<html>
<div class="picture-container first-picture horizontal-small">
<div class="picture-frame">
<img
id="secondPic"
src="https://picsum.photos/200/300"
alt="picture of a brick house"
class="picture middle-right"
/>
</div>
</div>
<html>
I’m also using Vuejs if it changes something for this