Greetings everyone, it's been a while since I dabbled in web development. I recently worked on my site with the intention of making it responsive using flexbox.
This is my first time posting here, so please guide me on how to seek help more effectively if I overwhelm you with information.
I currently have two pages - a home page and a gallery showcasing all my work.
Some of the HTML elements (videos) have specific libraries attached for functionality without JavaScript, like AOS (Animate on Scroll).
Although I managed to make the home page responsive for iPhone X, I'm struggling with getting the gallery page to be responsive in any way for any device, and it's becoming quite frustrating.
I understand that there may be numerous errors and better ways to approach this. Apart from focusing on the gallery page responsiveness, feel free to share any other tips on improving things.
If my question appears confusing, please assist me specifically with making the gallery page responsive for both iPhone X and iPad.
Thank you!
HTML GALLERY SECTION
<div class="gallery-section">
<h1>GALLERY</h1>
<h2>Harlem Globetrotters</h2>
<!-- More gallery content -->
@media only screen and (min-width: 375px) and (max-width: 812px) {
html {
width: 100%;
height: 100%;
overflow-x: hidden;
}
.nav-wrapper {
display: flex;
justify-content: center;
/* More CSS rules */
}