hello everyone , how do you make a web page not to scroll horizontally on small devices ??, i have used media queries but that’s a problem i encountered
here is the link to my product landing page, so i realized the problem when i resized the browser even after using media querries , am still working to improve on the project though ,
1 Like
Hey there! Could you explain exactly what kind of problem you’ve encountered so that we could give you a more detailed answer? If you could give us a code to the project that you’re struggling with, that would be even better
In general, I guess a very common problem to run into is using absolute measurements and then not overriding them properly in the media query. Or forgetting to account for margins and padding. But again, this is just generally speaking, and it’s probably not that helpful. If you want more specific tips, I suggest providing your code here or (even better) a link to your project, and explaining what the issue is, what you have tried and what you want to happen on the page.
sorry about that , just edited the post
OK, awesome, thanks! So, the problem is with the iframe
element. In HTML, you have fixed the absolute width and height (width="640" height="360"
). I would advise against this. Instead, you can set the width
property to a relative unit, like percentages, in the CSS and it will automatically scale with your page. Then, you can get more control over how it behaves by setting max-width
for example or changing the width
in media queries to better fit different devices. Play around with it and see what looks best
Hope this helps and good luck!
heyy Thanks , i was able to fix the problem, sure the thing iframe caused the glitch:grinning:
1 Like