How do I make my iFrame scrollable on Mobile? - css

I have a problem with an iFrame on my Mobile. When I open the webpage on my mobile there are no scroll bars or even an option to scroll the iFrame.
I've tried several CSS codes but nothing seems to work.
Can somebody help me out?
Cheers,

Related

Mobile devices horizontal scroll and images not centering

I'm working on a website and I have 2 problems with it for mobile devices. The problems may be linked.
If you go to this website on mobile - website
You will see that even though there's no element overflowing, the page can be scrolled left and right. I can't figure out why. I want the page to be stable, no left/right scrolling, as there's nothing to see on the right side.
The website only has 4 pages, but this happens on each page. But from what I can tell the width is 100%, so it shouldn't be happening.
And on the "ABOUT" page there are 3 images on the right, and for some reason they don't want to be centered when the site is viewed on mobile devices. They just overflow there.
Can anyone tell me how I can fix this?
The problem was solved. Marko Mackic pointed out the logo was too wide, and helped me fix it.

Navbar overflows scrollbars

I've been struggling with this problem for a few days now. Navigation bar on my page hides browser scrollbars. This happens in Chrome (both desktop and mobile) and Firefox - I didn't chceck other browsers yet but I suppose the result will be the same.
I tried like every single solution I found on Google and Stack Overflow but none of them fully worked. The navbar either kept covering the scrollbars or it wasn't clickable because it was under the rest of the page.
Can somebody browse my CSS and help me with this problem? Thanks a lot!
P.S.: I use no CSS framework. I downloaded the template from here and sligtly modified it.

Why does my site display differently on a mobile device when scrollbars are not present

When viewing my website from an iPhone or iPad my site displays just fine when scrollbars on present. However, when you access a page when scroll bars are not needed the display gets messed up. I have no idea how to resolve this issue. Any ideas?
For an example my website is www.surfboardswap.com. The homepage appears fine on a mobile device. But if you access www.surfboardswap.com/alerts the display does not fit on the page since scroll bars are not needed.
Thanks for the help!
It looks to me like both those links you provided render with scroll bars depending on the width of my browser screen. I think you're ultimate issue here is responsive design.
You have a width set on your .container css selector. This is breaking the responsiveness of you're site, because it's being forced to that width even on smaller screens. Try removing that!

mobile navigation doesn't fix on scrolling

I'm working for a responsive website on a slider like FB App. It works fine, but if the user scrolls, the open navigation moves with the content. I'm trying to put position: fixed to the element. This works,but if the navigation element is larger than the screen the rest of the content cannot reached. Example: http://lucie-hauri.com.beethoven.ch-meta.net/ (just put the screen to a width of about 300px an the mobile Icon appears, click on it for example).
Has anyone an idea how to fix this?
Thanks for help, regards
Thomas
I don't know if this is the cause, but you have a javascript error (check the console), which may break things up.

Why does my website shows a Horizontal Scroll

My website byteindia is built on Thesis Theme and Wordpress and shows a horizontal scroll bar. I am not able to figure out why. Can anyone help me point out the problem?
It's the twitter widget, one of the divs in the iframe is rendering 300px wide.

Resources