I have an iframe that is sized to the size of the inner content which is smaller than the viewport. It works without problems on desktop browsers, including desktop Safari. However, on mobile Safari, when the content width is less than 320px, the iframe stays at a width of 320px. How can I make an iframe in mobile Safari to be a width less than 320px?
UPDATE: SOLVED. This had to do with the default setting in the frontend framework (Semantic-UI) that was used, which had a min-width of 320px set on the body tag. Overriding this setting on the body tag solved this issue.
Thanks to those who contributed, but I solved my own problem. The problem was that the content within my iframe was using the Semantic-UI framework which had a min-width of 320px set on the body. I simply overrode it by setting min-width to 0 on body.