He tenido algunos problemas con el responsive design. La cuestión es que mi portfolio en pantalla grande funciona corréctamente, pero cuando lo utilizo en el móvil no se ajusta bien a la pantalla. Aparece, por ejemplo, una barra de scroll horizontal, y no debería aparecer, debería estar encajado (en el sentido horizontal). Pienso que pueden ser por los vídeos incrustrados desde youtube. He aquí el código de los vídeos:
@media screen and (max-width: 600px) {
.video-item-in{
overflow: hidden;
padding-bottom: 56.25%;
position: relative;
height: 0;
}
.video-item-in iframe{
left: 0;
top: 0;
height: 100%;
width: 100%;
position: absolute;
}
}
<div class="portfolio-item">
<div class="portfolio-description has-margin-right" data-aos="fade-right" data-aos-delay="100">
<h6>Video Edition</h6>
<h1>Shortfilm Opening</h1>
<p>Here is an opening created by a mini-show developed by Fine Arts Faculty of UCLM (Spain). It's made from After Effects and Premiere.
</p>
</div>
<div class="video-item-in" data-aos="fade-left" data-aos-delay="200">
<iframe width="560" height="315" src="https://www.youtube.com/embed/qgv1iV9nvQg" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen>
</iframe>
</div>
</div>
Alguna idea? Este es el link a mi portfolio para que se entienda mejor:
Gracias!