Hola buenas tengo este flipcard que he creado pero se me ve pegado al margen de abajo y no puedo añadirle margen para dejar el espacio del final de la página.
.flipscards__1 {
position: absolute;
margin-left: 200px;
margin-top: 550px;
margin-bottom: 30px;
width: 200px;
padding: 30px;
background-color: whitesmoke;
border: 2px groove;
border-radius: 20px;
font-family: 'Montserrat', sans-serif;
}
.flipscards__1:hover {
position: absolute;
transform: translateY(-30px);
transition: transform 3s;
}
<div class="flipscards__1">
<h3>Productos</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Facilis magnam possimus itaque non maiores natus ut deleniti labore recusandae velit, cumque doloremque suscipit quidem, totam temporibus asperiores similique? Voluptatibus, harum?</p>
<a href="">Leer Más</a>
</div>
Pero cuando le pongo un margin-bottom por ejemplo de 20px no se añade el margen y se queda pegado al final de la página, como podría solucionarlo?.