The following webpage does not allow the user to scroll left or right. This is an issue when the viewport is smaller than 960px as the site is not responsive.
The site doesn't scroll when javascript is disabled which leads me to believe that this is being achieved by HTML or CSS
What code is achieving this and how do I remove it?
Site: http://oddschanger.com
there's a lovely
overflow-x: hidden
in main.css line 166
hope this help
Related
I have a problem with my site, particularly when I open it from my smartphone.
The problem is that the scroll bar does not make me go up and cuts a part of my container, as you can see, the word REGISTER is very attached to the browser bar. Here's the picture: screen
On the computer this problem is not there, as you can see, there is a padding between the title and the container: screen
Please help me if anyone has the idea of how to fix it.
add this in your template style or after your style
<style>
*{
overflow-y :scroll;
}
</style>
i hope it was useful
Got a strange layout problem on my website. This only occurred in responsive and only on an article page. On the start page everything is fine, but when i open an article and watch it on my phone or the responsive-emulator from chrome developer-tools, i can scroll to right.
I tryed to debug this, watch the dom-highlighter from the dev-tools but i cant find a reason why there its possible to scroll to right. The insepector shows me no margin or padding.
Startpage: https://pokefans.online
Article-Page: https://pokefans.online/artikel/kyogre-leichter-zu-fangen-mit-neustem-update/434/
Really appreciate for your help.
The one causing the issue is the .article_trainer_row, particularly the .article_traier_text as it has a fixed width of 335px.
Using width:100% should fix it. (maybe with a max-width so it doesn't go bananas on higher resolution)
I'm currently making a new website for my school and some of my webpages have more content than others and they require scroll bars and when you open these pages, the content moves with a few mm to the left which is really annoying and I can't leave it like that.
Some people advice me to target the html tag and use the overflow-y:scroll property but that way the pages with a few lines of text get a unusable scroll bar - it just looks unprofessional... Is there another option to bypass that issue? I'll be grateful if you can answer me :)
overflow-y: auto;
Causes the scroll bar to be visible when it is needed. Otherwise it will stay hidden. Try and see if it works.
So, I've spent about 9 hours straight on this, and I was wondering if anyone could help me.
For some reason, this block of code shifts over my navbar to the left by about a pixel. I don't really understand why, I thought I screwed up with some tags, but after experimenting, I've narrowed the problem down right to [here][1].
[1]: http://pastebin.com/2iZwnFZs (not available anymore)
Figured it out!
A friend told me to use CSS to fix this, here's the CSS I used:
body {overflow-y: scroll; overflow-x: hidden;}
The cause of the navbar shift was the scroll bar, the code above will hide the scroll bar when it overflows data horizontally.
I'm trying to position an image on my website that is wider than the resolution, which creates a horizontal scroll bar every time. I know someone who has a site with an image wider than the screen but his site doesn't cause you to scroll.
Does anyone know a code or a fix to the code that I can add to make the page unscrollable horizontally?
Thanks!
Add overflow-x: hidden to your <html> tag, or set the image as background-image instead, if the image is for design purpose and no content.
body {
overflow-x:hidden;
}