Embedded blog displays too wide on iPhone

[benstanbury]

Hi All,

I'm having an issue with an embedded Nabble blog which is displaying too wide on iphones only.

It shows up fine on Ipads, Android phones and computer screen, but when you view it on an iphone it bleed off the right of the screen. You can't even scroll across.

I have added this code on the CSS style sheet

.blog-text img {
 width:100%;
}

This is what it look like currently...



I see that this is an issue for others on the forum. Does anyone have any solutions?

Many thanks  - Ben

[GregChapman]

Yours is not just a "Nabble problem". It looks as if it is an issue with site in which it is embedded.

Reduce the width of the viewport/window on any desktop browser and you find the same thing happens. You lose the right side of the page, with menu options becoming invisible and the icons to the right overlapping the remaining menu options - and no scrollbar appearing!

It looks like the redesign of the code behind your main site may be called for as a first step, although the answer I gave at:
http://support.nabble.com/Mobile-Phone-Blog-tp7594162p7594175.html
will apply as well, so a total solution may not be available at present.

[benstanbury]

Thank you Greg for your post.

It turns out the culprit was a long url link in the post which was 'breaking out' of the iframe.

Code has now been added which allows the url to split over several lines and the problem has been resolved.

Best wishes,

Ben