[Pro] iFrame formatting

I’m trying to format an HTML item with iFrame action to consistently fit 90% page width. When previewing in the browser, the frame sticks to the left of the page, not stretching.

How do I fix this?


freewaytalk mailing list
email@hidden
Update your subscriptions at:

Could you post a link to the page where you are seeing this issue? It’s difficult to diagnose without seeing the generated code.

Walter

On Jun 8, 2017, at 7:59 AM, Jack email@hidden wrote:

I’m trying to format an HTML item with iFrame action to consistently fit 90% page width. When previewing in the browser, the frame sticks to the left of the page, not stretching.

How do I fix this?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
Information for existing FreewayTalk / Groups.io users - Site Feedback - Softpress Talk


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

On 8 Jun 2017, 12:09 pm, waltd wrote:

Could you post a link to the page where you are seeing this issue? It’s difficult to diagnose without seeing the generated code.

Walter

On Jun 8, 2017, at 7:59 AM, Jack

here you go


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

The width is displaying 304 px rather than a desired percentage of the page


freewaytalk mailing list
email@hidden
Update your subscriptions at:

Further, the iframe is positioned absolutely rather than inline, which means that when I add a line of CSS to the page to scale it up, the text describing the iframe overlays it, rather than scooting out of the way.

To see what I mean, open the Page / HTML Markup dialog, move to the Before section using the picker below the text field, then paste in this code:

<style type="text/css">
iframe { width: 100%; height: 500px; }
</style>

Preview in a browser and you’ll see things crashing into one another.

The way around this is to use an inline layout (at least for this part of the page). Draw a box full-width, then set its width to 100% (using the Dimensions part of the Item Inspector). Double-click inside this item, so you see a flashing text cursor, then choose Insert / Action Item / iFrame from the menu. Make the URL, border, and scrolling settings, drag the box out to the width of the parent item, choose a height that works, and with the aforementioned CSS, you should be able to have a flexible iframe. Note that unless the page you inserted into the iframe is also designed in a flexibly-responsive manner, you will potentially have some side-scrolling to deal with when the outer page (containing the iframe) is resized smaller.

Walter

On Jun 8, 2017, at 8:20 AM, Jack email@hidden wrote:

The width is displaying 304 px rather than a desired percentage of the page


freewaytalk mailing list
email@hidden
Update your subscriptions at:
Information for existing FreewayTalk / Groups.io users - Site Feedback - Softpress Talk


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

Works great, thanks so much for your help


freewaytalk mailing list
email@hidden
Update your subscriptions at: