I have implemented a website using twitter bootstrap. At the top of the site I have used a nav bar, and inside that used a dropdown menu. The dropdown menu is made up of < ul > and < li > tags. I am showing a list of members inside that dropdwon menu. When the list of member grows the dropdown menu grows horizontally, for which I have added a overflow: auto to the dropdown-menu class. Now its showing an vertical scroll bar, and working fine in browser.
But the same thing is not working in iPad and other iOs devices. I have googled it and found -webkit-overflow-scrolling: touch should work. But it is not working for me. Lot of other solutions are also present, but unfortunately not working for me.
Is there any better solution available. May be anything we can do using css itself.
I have implemented a website using twitter bootstrap. At the top of the site I have used a nav bar, and inside that used a dropdown menu. The dropdown menu is made up of < ul > and < li > tags. I am showing a list of members inside that dropdwon menu. When the list of member grows the dropdown menu grows horizontally, for which I have added a overflow: auto to the dropdown-menu class. Now its showing an vertical scroll bar, and working fine in browser.
But the same thing is not working in iPad and other iOs devices. I have googled it and found -webkit-overflow-scrolling: touch should work. But it is not working for me. Lot of other solutions are also present, but unfortunately not working for me.
Is there any better solution available. May be anything we can do using css itself.
Share Improve this question edited Aug 26, 2013 at 7:29 Jakub 13.9k17 gold badges83 silver badges142 bronze badges asked Aug 26, 2013 at 7:20 sandeepsandeep 3,34511 gold badges38 silver badges57 bronze badges 4-
use both
overflow: scrolland-webkit-overflow-scrolling: touch;. link. and also have a look at this link Barrow.io – Mr_Green Commented Aug 26, 2013 at 7:43 - Yeah, everywhere its written that -webkit-overflow-scrolling: touch; should work, but don't know why its not working for me. – sandeep Commented Aug 26, 2013 at 8:06
-
use with
overflow: scrollnot withoverflow: auto.. – Mr_Green Commented Aug 26, 2013 at 8:07 - Is it not working because I am trying to use it for a < ul > tag, and it should work for a < div > ? Since I am using twitter bootstrap dropdwon-menu, I am not able add a > div > there. – sandeep Commented Aug 26, 2013 at 8:13
1 Answer
Reset to default 3Add the css property in to your div tag -webkit-overflow-scrolling: touch