www.webdeveloper.com
Results 1 to 8 of 8

Thread: Resizing Page inside an Iframe

  1. #1
    Join Date
    Feb 2013
    Posts
    12

    Resizing Page inside an Iframe

    Hi Everyone,
    Is it possible to resize the webpage inside of an iframe? I would like to make the width of the page inside of the iframe the same as the width of the iframe so that I do not need to use the horizontal scroll bar to see the full width of the webpage? Thanks in advance.

  2. #2
    Join Date
    Jun 2009
    Location
    NY
    Posts
    96
    Hi Developer1,

    You can accomplish this by setting the width property of your page's body. The body's width will need to be a little less than the width of the iframe though. Assuming your iframe is 600px, the following code can be used.
    body {
    width: 560px; /* You might be able to use a little more than that. Experiment if you like */
    }

    Hope this helps.

  3. #3
    Join Date
    Mar 2013
    Location
    London
    Posts
    18
    Why are you using an iframe anyway?

  4. #4
    Join Date
    Feb 2013
    Posts
    12
    Hi, thanks for replying. I am using an iframe to display external web pages on my site. I've read that you can use the object element to display external web pages on your site but I don't know if it is compatible with non-microsoft browsers.

  5. #5
    Join Date
    Feb 2013
    Posts
    12
    Hi, thanks for replying. When you say "setting the width property of your page's body", are you talking about the width property of my web page or the width property of the external web page being displayed inside of my iframe? If you are referring to the width property of my web page, wouldn't setting its width to 600px or less mess up its current layout?

  6. #6
    Join Date
    Jun 2009
    Location
    NY
    Posts
    96
    I was referring to the body tag's width property of the external page that you are trying to load via iframe.

  7. #7
    Join Date
    Feb 2013
    Posts
    12
    Hi I forgot to ask you how one can set the width property of an external page that is not on your domain. I know how to set the width property of any page within my domain but not a page that belongs to other people's domain.

  8. #8
    Join Date
    Jun 2009
    Location
    NY
    Posts
    96
    Hi,
    Normally, you can't change CSS on the external file. There are ways to accomplish this though like using PHP's file_get_contents function to retrieve the external file's content, modify it to your needs, and re-save the file on your domain. Another option is to get the external file's contents via AJAX, then your site's global styles will naturally apply to it.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles