Results 1 to 4 of 4

Thread: Don't apply page margins to iframe!

  1. #1
    Join Date
    Oct 2008
    Posts
    21
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Post Don't apply page margins to iframe!

    Hi folks,
    I have a ‘page a’ using ‘css a’. This page has margins set in css. I also have a ‘page b’ using ‘css b’. This page also has margins set in css, of the same size as in ‘css a’ (10%).

    Is there any way I can make it so that when I am viewing ‘page a’ on its own it has margins, but when viewed in an iframe on ‘page b’ the margins don’t apply on ‘page a’. I know that’s kind of a long way of asking but the basic problem is that I am getting ‘double margins’ for the content in the iframe: the margin from ‘page a’ and then the margin from ‘page b’!

    I guess one way of doing it would be to set the iframe not to be affected by ‘page a’s’ margins. Is there some way I can set ‘css a’ to exclude the iframe from the margins, that way only the margins from css b would apply and the page would still be in alignment. is that possible?

    I have already tried naming the iframe ‘hello’ and setting “Iframe#hello {0px -10% 0px -10%;}” in the css b but it didn’t quite work… the left margin disappeared and the right margin doubled in size!

    I also tried setting marginwidth=”-10%” in iframe on page b but that doesn’t seem to make a difference whatever I put as the margin width – I guess it is overwriden by the css?

    See test case pages : (trying to get the blue box to fill the iframe in effect)

    http://cart3.jaspers-sensations.com/test/pagea.html
    http://cart3.jaspers-sensations.com/test/pageb.html
    http://cart3.jaspers-sensations.com/test/stylea.css
    http://cart3.jaspers-sensations.com/test/styleb.css

    Thanks for any help I’m totally stumped!

    Matt

  2. #2
    Join Date
    May 2007
    Location
    Boston,ma
    Posts
    2,127
    Thanks
    173
    Thanked 207 Times in 205 Posts

    Default

    Code:
    BODY {
    	background: #222431;
    	color: #FFFFFF;
    	font-size: 11px;
        margin: 0px 50px 0px 50px;  
    	font-family: Verdana, Arial, Helvetica, sans-serif;	
    }
    1.You could make the margin in a class and have it start above the iframe end at the iframe then restart after the iframe till the end of the page.

    2. You could write some conditional statement in php or java to say something like if (iframe=pageb) { then margin = something something;}(no where near what it would actually be though dont try and use this).

  3. The Following User Says Thank You to bluewalrus For This Useful Post:

    mastubbs (11-30-2008)

  4. #3
    Join Date
    Oct 2008
    Posts
    21
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Default Still trying....

    Hey thanks bluewalrus, I'm not sure how to do it with java/php but i tried with classes. It seems to work with text but not tables. Is there some way to apply the margin rules to tables also? It works in IE but not in FF Opera or safari

    this is a page that works in IE but not the others: http://cart3.jaspers-sensations.com/test3/6.html

    any ideas?

    Thanks

    Matt

  5. #4
    Join Date
    May 2007
    Location
    Boston,ma
    Posts
    2,127
    Thanks
    173
    Thanked 207 Times in 205 Posts

    Default

    Try this...
    Current code (in html)
    <table class="restof" width="100%" border="0">
    new
    <table class="restof" border="0">
    if that doesnt work try in css
    Code:
    table {
    margin: 0px 10% 0px 10%; 
    }

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
  •