I'm having a similar problem to this here:Scroll bar not appearing?. My scrollbar is enabled using the comment overflow : auto. It's also working perfectly fine, if I use the top and down arrows on my keyboard. However the scrollbar is not visible on my modal window. I tried overflow-y: scroll as well as overflow-scroll.Didn't help. Any ideas whatelse I could try?
Related
I'm trying to create a simple carousel with horizontal scroll with using -webkit-overflow-scrolling: touch and overflow-x: auto. Here is source code: https://codesandbox.io/s/wizardly-tu-xxfz0?file=/index.html:333-350
This works perfect for me everywhere, except iOS devices. But vertical scroll appears on iOS browsers. Here is the video: https://youtu.be/BNugrdxX9MU
I know that i can fix it by setting overflow-y: hidden on carousel container or on element container. But this solution doesn't suit me, because i need to show some content outside the element or container with absolute positioning.
It looks like as an iOS bug. Are there any ideas how to fix it?
I have created a top scroll bar. So when you make the panel smaller you need to scroll to see the rest of the menu.
This works fine on Safari on the Mac and on Google OS BUT not on a Windows computer, Instead, you get a nasty grey scroll panel at the bottom of the blue panel.
Is there a way to get rid of this please but still be able to scroll as shown in the example.
Hope you can help
Thanks
Tim
/Users/timcross/Desktop/111111.png
I cannot turn off overflow-x: scroll as I need this to scroll so not sure how to get around this
https://jsfiddle.net/timcross/hf8byg2r/
scroll panel is always visible because of the CSS property overflow-x and the overflow-y property has the value of "scroll",
this consider as the block always needs scroll,
you can change it to auto, then it will consider the correct behavior and add scroll panel if needed.
overflow-x: scroll;
Change to
overflow-x: auto;
same for the overflow-y
In my page, I have a modal that opens when a button is clicked. But it looks wonky because two scrollbars show up:
The css I used: https://codepen.io/bootpen/pen/jbbaRa?editors=1100
I want it to have only the scrollbar for the modal when the modal is open and switch back to the parent scrollbar when closed. I tried doing it with overflow-y: hidden, but that disables scrolling instead.
What am I missing here?
Its not showing me two scrollbars when I see your project on Codepen
I think there is a problem with your Browser
i was just playing with the navbar of bootstrap and got into this design issue that bootstrap already seems to have. Just go to this example page that the site has: http://getbootstrap.com/examples/navbar-static-top/. Now resize the window to a smaller width till you get the navbar collapsed and click on the right icon where it shows the navbar elements in vertical fashion. Now click on the 'dowpdown' link so that it shows a dropdown. leave it as it is , dont click it again and resize the browser window to the previous full width. you might see the issue where the dropdown is below the content and is inside a overflow: auto type box. any answers how this can be solved?
I resolved this issue by adding the following to my custom CSS file which is loaded after the bootstrap css. Seems to have worked so far...
.navbar-collapse.in {
overflow-y: visible;
}
I added the facebook Like button to my website and am having an issue. When the Like button is clicked, the box that pops up doesn't overlay the other content like it does on most websites, instead creating a vertical scrollbar in the container (expanding it).
This issue actually exists on facebook's own website:
https://developers.facebook.com/docs/reference/plugins/like/
If you scroll about half way down the above page and click the Like button, the same issue happens:
The only difference there is that they have overflow set to hidden, instead of auto.
How can this be fixed?
Add to your CSS file:
.fb-like{overflow:hidden;}
This should solve the problem.