How do I target iframe to show...

Discussion in 'HTML & Website Design' started by mel_akey, Aug 24, 2006.

  1. #1
    I want to put an Iframe showing the content from site a on site b... but when I set up the iframe it always shows the top left corner of the website in the frame... I want it to show the content of the page which is toward the center/bottom of the page.

    this is my code:
    <iframe src="http://**********" width="400" height="400" scrolling="yes"
    frameborder="0"></iframe>

    the frame shows the page just fine but it focused on the top left corner... which is my logo... what do I add to make it show the middle of my src page (the content)?
    Thanks!
    Mel
     
    mel_akey, Aug 24, 2006 IP
  2. Mike S.

    Mike S. Well-Known Member

    Messages:
    468
    Likes Received:
    17
    Best Answers:
    0
    Trophy Points:
    110
    #2
    Do you know how to use div tags in CSS? If so surround the iframe in a div tag, and align it to center.

    Should be like this:

    <div align="center" width="400" height="400">
    <iframe src="http://**********" width="400" height="400" scrolling="yes"
    frameborder="0"></iframe>
    </div>
    Code (markup):
    I'm not entirely sure, but try it out.
     
    Mike S., Aug 24, 2006 IP
  3. adacprogramming

    adacprogramming Well-Known Member

    Messages:
    1,615
    Likes Received:
    62
    Best Answers:
    0
    Trophy Points:
    125
    #3
    Here is the code I used for http://www.mt-gatervpark.com/reservations.aspx

    I needed to only take a portion of the the html page and put it in an iframe. this allowed me to remove the navigation and header of the site we use to do our reservations, and use our own.


    <iframe align="right" class="ReservationsiFrame" 
    src="http://www.campingfriend.com/MountainGateRVPark/default.asp?file=reservations"
    style="WIDTH: 750px; HEIGHT: 1200px" scrolling="no"></iframe>
    Code (markup):

    CSS Code
    .ReservationsiFrame
    {
    	left: 10px;
    	clip: rect(90px auto auto 160px);
    	position: absolute;
    	top: 200px;
    }
    Code (markup):
     
    adacprogramming, Aug 24, 2006 IP
  4. MrIzzard

    MrIzzard Peon

    Messages:
    1
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Hello there!

    I'm actually struggling to make this work. Is it a browser specific thing?

    cheers
     
    MrIzzard, Apr 3, 2008 IP
  5. adacprogramming

    adacprogramming Well-Known Member

    Messages:
    1,615
    Likes Received:
    62
    Best Answers:
    0
    Trophy Points:
    125
    #5
    Exact placement changes somewhat by browser. But that is usually only by a few pixels. Other than that, is works the same on all browsers.
     
    adacprogramming, Apr 3, 2008 IP