SitePoint Sponsor

User Tag List

Results 1 to 11 of 11
  1. #1
    SitePoint Enthusiast
    Join Date
    Sep 2004
    Location
    seattle.usa
    Posts
    84
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    iframes & css properties

    hello!

    i've got several iframes on a page, that i want modified by an external style sheet. i cant seem to remember the format for getting rid of the border from the external style sheet!

    here's what i've got (that I'SNT working)


    HTML Code:
    /*iframe*/
    #first { 
    margin: 0px; 
    width:336px;
    height: 400px;
    frameborder: none;
    border:0px;
    border:none; /*mozilla?*/
    overflow:hidden; /*mozilla?*/
    
    }

    HTML Code:
    <iframe id="first" src="mywebsite.com"></iframe>

    the mozilla stuff was some code i found somewhere online.. dont know if its doing any good or not..

    so, if somebody could tell me how that should be coded, i'd appreciate it!

    also, does anybody know of any places where i could see a list of all the atributes for the iframe tag, and how they are written out in an external style sheet?

    thanks for any help you can give me!

  2. #2
    Web Design Addict
    Join Date
    Mar 2004
    Posts
    2,159
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm not that good with iframes and style sheets (hence trying myself before)

    My advise to you is to get rid of your iframes....they are going to cause you headaches with CSS. I once had iframes on my site and they did nothing but cause a promblem a day it seemed. I think a lot of people will give you the same adivce. Whatever you're trying to accomplish with them, there has to be a better way.

    hope that helps.

  3. #3
    SitePoint Enthusiast
    Join Date
    Sep 2004
    Location
    seattle.usa
    Posts
    84
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by deronsizemore
    My advise to you is to get rid of your iframes....they are going to cause you headaches with CSS.
    heh heh... i've used iframes before on my site, but always with inline styles... never had ANY problems.. in fact, i really like them! lol.. differnt strokes for differnt folks, right? but deronsizemore, i certainly appreciate thoughts though!

    any other ideas out there?

  4. #4
    Web Design Addict
    Join Date
    Mar 2004
    Posts
    2,159
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    No problem.

    If you can make them work then go with.... I couldn't.

  5. #5
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,556
    Mentioned
    183 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    You could just set the border to the background of the page and then it won't be noticable.

    Assuming the page is white
    Code:
    iframe {border:1px solid #fff;}
    Paul

  6. #6
    SitePoint Enthusiast
    Join Date
    Sep 2004
    Location
    seattle.usa
    Posts
    84
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Paul O'B
    Hi,

    You could just set the border to the background of the page and then it won't be noticable.
    Paul
    thanks paul, but unless i made some error i'm not seeing, that didnt seem to work. seems like it should have though.. well, here's a screen shot of what it looked like in IE, and the code:

    HTML Code:
    /*iframe*/
    #first { 
    margin: 0px; 
    width:336px;
    height: 400px;
    border:1px solid #B20606;
    
    }
    Attached Images Attached Images

  7. #7
    SitePoint Enthusiast
    Join Date
    Sep 2004
    Location
    seattle.usa
    Posts
    84
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hmm... this site keeps telling me:

    "You have already attached this file to a post. If you need to refer to this file it can be found in this thread: iframes & css properties"

    heh heh.. well i'm looking at my post and right now "I" dont see my screen shot! well.. needless to say, pauls suggestion didnt quite work for me.. any other ideas?

  8. #8
    Web Design Addict
    Join Date
    Mar 2004
    Posts
    2,159
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    your screen shot will show up eventually...the moderators have to review it first.

  9. #9
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,556
    Mentioned
    183 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    Try adding overflow:auto as well.

    Code:
    /*iframe*/
    #first { 
    margin: 0px; 
    width:336px;
    height: 400px;
    border:1px solid #B20606;
    overflow:auto;
    }
    Paul

  10. #10
    SitePoint Enthusiast
    Join Date
    Sep 2004
    Location
    seattle.usa
    Posts
    84
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hmm... that didnt seem to work either...

    i know by adding the attributes directly to the iframe, i can get it to work properly.. drats.. its just that after looking at: http://csszengarden.com i figured should start being more dilligent about doing all of that from an external style sheet..


    HTML Code:
    <iframe src="home.htm" marginheight="0" scrolling="no" frameborder="0"></iframe>
    thats some code from an old website of mine, and IS a working answer... just not the working answer i was looking for..

  11. #11
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,556
    Mentioned
    183 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    Sorry, I tried it without any source file in the iframe and it works fine but as soon as you put the source file in then the 3d border appears .

    You'll have to use the frameborder attribute which is still valid html.

    Paul


Bookmarks

Posting Permissions

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