Resizing Embed For Device

I have a Google spreadsheet embedded on a page that I set up with the PC/Landscape Tablet device default. The iframe width is 960. When I go to custom set up the Portrait Smartphone device the 960 width is of course too large, but if I change it to 320 it also shows up as 320 for the PC/Landscape Tablet device. Is there a workaround or am I missing something in the set up? Here is the embedded content:

@updeinva, to make the embedded element responsive you shouldn’t give a fixed width but a % width. Give it a width of 100% and that way it will fill out the screen realestate.

Thank you for the reply. I changed the width to 100% and it looks fine on the PC/Landscape Tablet view. When I switch over to custom layout for Portrait Smartphone there is no change. The spreadsheet is still too large. When I initially click on the Portrait Smartphone device button and the layout first appears, it shows up fitting the screen correctly for a split second, but that disappears and it comes up as too large. Any ideas? Thanks.

I’ve never used Google Spreadsheets but I’m imaging that it doesn’t collapse its width on mobile, or if they are coded tables then that also won’t collapse.

So a few suggestions…

  • See if Google Spreadsheets offers a mobile version of the spreadsheet and if so you will need to hide the desktop/tablet embed on mobile and introduce a new embed on mobile and hide it on the tablet/desktop
  • Hide the embed on mobile and introduce a manually created table layout of the spreadsheet and of course hide that from tablet/desktop
1 Like