[smerriman]

My smartphone has a 412x892 resolution. Due to some margins and padding, this means standard 400x300 handviewer iframes inside forum posts don't fit on the screen; South's bidding is always offscreen and inaccessible.

There is some inline CSS on the forum pages:

/* CSS: bbo_handviewer*/
.hv_frame {
    border: 0;
    float: left;
    padding-right: 0.2em; /* Separate diagram from text */
    padding-top: 0.4em; /* Separate one diagram from another */
}

Any chance you can add:

.hv_frame iframe {max-width:100%;}

Then on my screen it'll scale down to fit (it'll add whitespace underneath since it has a fixed height rather than scaling responsively, but at least it'll be readable).

[pescetom]

I have the same problem and always have to (enable auto-rotate and) rotate to see the full bidding. This would be a useful fix.

[smerriman]

Ooops, my mistake - I see you actually implemented the code already (thanks, super quick ) but I had a typo - it's just:

.hv_frame {max-width:100%;}

since that's the iframe itself.

[pescetom]

smerriman, on 2022-July-05, 14:39, said:

Ooops, my mistake - I see you actually implemented the code already (thanks, super quick ) but I had a typo - it's just:

.hv_frame {max-width:100%;}

since that's the iframe itself.

I hope that works better, because I still lack S bidding on my phone.

[Gerardo]

.hv_frame {
	border: 0;
	float: left;
	padding-right: 0.2em; /* Separate diagram from text */
	padding-top: 0.4em; /* Separate one diagram from another */
	max-width:100%;
}

[smerriman]

Hm, looks like it's only being output on desktop. I guess the forum must be using a different theme for mobile and so CSS has to be added to a different place to get it to show up there.

[Gerardo]

Please recheck.

[smerriman]

Still not seeing any relevant CSS output to mobile user-agents.

But it looks like mobile-specific CSS is in https://www.bridgeba.../ipb_styles.css, so editing that file should work.

[Gerardo]

There is only one source for .hv_frame, currently named: https://www.bridgeba..._handviewer.css (name might change in the future).

If you are seeing .hv_frame, it is defined here, there is no separate definition for mobile. It might be using a different version of this file though.

I just ensured all sources for this file are sync'ed with the max-width content added.

If you don't see it in your device, try reloading this file.

If still having issues, yell.

[smerriman]

It looks like what's happening is that on desktop, it's embedding all the stylesheets stored in the css_15 folder, while on mobile, it ignores all of these and embeds all the stylesheets from the css_2 folder instead.

So copying bbo_handviewer.css into the css_2 folder instead should work (but the float + padding aren't needed in the copy as they need to be in separate columns anyway).

My original message about seeing hv_iframe was me looking at the source on desktop; I didn't realise at that point it was different on mobile (where no hv_iframe is showing at all).

[Gerardo]

I see. I need to look at this closer.

[barmar]

This might have something to do with the different forum "skins" for mobile and desktop.