Use CSS to hide part of a frame?

Discussion in 'Web Design and Development' started by kevindosi, May 18, 2009.

  1. kevindosi macrumors regular

    Joined:
    Mar 16, 2006
    #1
    I want to put a google latitude badge on my website. If you haven't seen it, it looks like this - Has the map on there and below it some text (location, time updated, etc). All of this is contained within an iframe. I don't want any of that text below, I just want the map. I was wondering if I can use CSS or some other method to get rid of this text. I was thinking of putting the iframe into a div with a fixed height, but that doesn't seem to do anything. Any suggestions? I'd really appreciate it.
     
  2. angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #2
    Can't you just adjust the height of the iframe?
     
  3. kevindosi thread starter macrumors regular

    Joined:
    Mar 16, 2006
    #3
    Unfortunately I can't change the size of the iframe. If I do, it just shrinks down the content to fit inside. the code is:
    HTML:
    <iframe src="http://www.google.com/latitude/apps/badge/api?user=-3797161116671515245&type=iframe&maptype=roadmap" width="180" height="300" frameborder="0"></iframe>
    Changing the iframe's height only makes it worse.
     
  4. angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #4
    Ah, so it sounds like the content of the iframe is set to 100% height. Along with wrapping the iframe with a div and giving it a height you'll also wan to set the overflow to hidden.
    Code:
    #wrapper {
     height: 280px;
     overflow: hidden;
    }
    This worked on a simple test case I did.
     

Share This Page