Overflow Hidden not hiding in IE

Discussion in 'HTML' started by bryanrite@gmail.com, May 8, 2006.

  1. Guest

    I'm trying to set up a page with a static block on the left and
    variable on the right, it works as expected, but when i add an image,
    or google ad, in firefox it behaves as expected, but IE drops the div.
    Anyone have any ideas?

    http://footstops.dev01.alkaloid.net/test.php

    Any help would be greatly appreciated!
     
    , May 8, 2006
    #1
    1. Advertising

  2. wrote:

    > I'm trying to set up a page with a static block on the left and
    > variable on the right, it works as expected, but when i add an image,
    > or google ad, in firefox it behaves as expected, but IE drops the
    > div. Anyone have any ideas?
    >
    > http://footstops.dev01.alkaloid.net/test.php


    It may have to do with the fact that your CSS is setting the margin-left
    to 360px, then immediately resetting it to zero.

    margin-left: 360px;
    border: 1px dashed red;
    padding: 0;
    margin: 0;

    "margin" is for all four sides.

    [Google ads are blocked by my HOSTS file...]

    --
    -bts
    -Warning: I brake for lawn deer
     
    Beauregard T. Shagnasty, May 8, 2006
    #2
    1. Advertising

  3. ironcorona Guest

    wrote:
    > I'm trying to set up a page with a static block on the left and
    > variable on the right, it works as expected, but when i add an image,
    > or google ad, in firefox it behaves as expected, but IE drops the div.
    > Anyone have any ideas?
    >
    > http://footstops.dev01.alkaloid.net/test.php
    >
    > Any help would be greatly appreciated!


    Didn't I already solve this problem for you over at
    alt.infosystems.www.authoring.stylesheets


    --
    Brian O'Connor (ironcorona)
     
    ironcorona, May 8, 2006
    #3
  4. ironcorona Guest

    ironcorona wrote:
    > wrote:
    >> I'm trying to set up a page with a static block on the left and
    >> variable on the right, it works as expected, but when i add an image,
    >> or google ad, in firefox it behaves as expected, but IE drops the div.
    >> Anyone have any ideas?
    >>
    >> http://footstops.dev01.alkaloid.net/test.php
    >>
    >> Any help would be greatly appreciated!

    >
    > Didn't I already solve this problem for you over at
    > alt.infosystems.www.authoring.stylesheets


    I hope you're not click farming


    --
    Brian O'Connor (ironcorona)
     
    ironcorona, May 8, 2006
    #4
  5. ironcorona Guest

    ironcorona wrote:
    > wrote:
    >> I'm trying to set up a page with a static block on the left and
    >> variable on the right, it works as expected, but when i add an image,
    >> or google ad, in firefox it behaves as expected, but IE drops the div.
    >> Anyone have any ideas?
    >>
    >> http://footstops.dev01.alkaloid.net/test.php
    >>
    >> Any help would be greatly appreciated!

    >
    > Didn't I already solve this problem for you over at
    > alt.infosystems.www.authoring.stylesheets


    I hope you're not click farming. It's strange that you would change all
    the code (even after I corrected it) and still come up with the same
    problem.

    --
    Brian O'Connor (ironcorona)
     
    ironcorona, May 8, 2006
    #5
  6. Guest

    No, your code has the exact same behaviour as mine. Check out
    http://footstops.dev01.alkaloid.net/test2.php thats your code, copy and
    pasted. I am NOT click farming, i genuinly need to figure out why this
    ad will not hide in IE. I changed all the code because, as I said
    earlier, I was cleaning it up from the more complex page to this test
    case.
    I figure it has something to do with iframes and overflow:hidden (as
    google ads generate iframes).

    Thank for your, albeit cynical, help so far.
     
    , May 8, 2006
    #6
  7. Guest

    i've even taken out the google ad, so as not to arouse suspicion. And
    I still get the same behaviour.
     
    , May 8, 2006
    #7
  8. ironcorona Guest

    wrote:
    > No, your code has the exact same behaviour as mine. Check out
    > http://footstops.dev01.alkaloid.net/test2.php thats your code, copy and
    > pasted. I am NOT click farming, i genuinly need to figure out why this
    > ad will not hide in IE.


    ..bannerAd {visibility:hidden;} or
    ..bannerAd {display:none;} if you want to collapse the box

    > Thank for your, albeit cynical, help so far.


    ok, I apologise. I didn't understand what you wanted. I thought you
    wanted to solve why the div on the left was dropping below the rest of
    the content. You didn't mention that you were trying to get rid of the ad

    --
    Brian O'Connor (ironcorona)
     
    ironcorona, May 8, 2006
    #8
  9. ironcorona Guest

    ironcorona wrote:
    > wrote:
    >> No, your code has the exact same behaviour as mine. Check out
    >> http://footstops.dev01.alkaloid.net/test2.php thats your code, copy and
    >> pasted. I am NOT click farming, i genuinly need to figure out why this
    >> ad will not hide in IE.

    >
    > ..bannerAd {visibility:hidden;} or
    > ..bannerAd {display:none;} if you want to collapse the box
    >


    only one .
    I don't know how that happened twice

    --
    Brian O'Connor (ironcorona)
     
    ironcorona, May 8, 2006
    #9
  10. Guest

    haha, no you were right the first time, i can't figure out why its
    dropping in ie. i've set up another one at
    http://footstops.dev01.alkaloid.net/test3.php that is super simple and
    should illustrate my problem. In ie, when you reduce the width of the
    browser, the bannerad will drop as its not a variable width like the
    other two. in FF it hides tho, IE it drops.

    thank you so much for all your help Brian.
     
    , May 8, 2006
    #10
  11. ironcorona Guest

    wrote:
    > haha, no you were right the first time, i can't figure out why its
    > dropping in ie. i've set up another one at
    > http://footstops.dev01.alkaloid.net/test3.php that is super simple and
    > should illustrate my problem. In ie, when you reduce the width of the
    > browser, the bannerad will drop as its not a variable width like the
    > other two. in FF it hides tho, IE it drops.


    It's dropping because of how ie handles the float property, which you
    have applied to #map. After trying a few things I think that without
    better support for the display:inline-block; property what you're doing
    isn't practical at the moment, cross-browser.

    I put together this little hack to figure out whether it has the
    properties that you *want* the page to have. I wouldn't suggest using
    it because it'll break on loads of different display types. AND it's
    all in absolute dimensions. This is just to make sure I'm on the same
    page as you (so to speak).

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title></title>
    <style media="screen" title="Main CSS" type="text/css">
    /* CSS Document */
    /* Ad divs */

    body {margin-top:8px;}

    #bannerAd {
    border: 1px solid orange;
    padding: 0px;
    width: 100px;
    height: 50px;
    position:absolute;
    left:370px;
    top:35px;
    }
    #map {
    width: 350px;;
    height: 300px;
    border: 1px dashed green;
    }
    #userBlock {
    border: 1px dashed blue;
    padding: 0;
    width:645px;
    position:absolute;
    left:370px;
    top:8px;
    }
    #blog {
    border: 1px dashed red;
    padding: 0;
    width:645px;
    position:absolute;
    left:370px;
    top:90px;
    }
    </style>
    </head>
    <body>
    <div id="map">map</div>
    <div id="userBlock">userblock</div>
    <div id="bannerAd">bannerad</div>

    <div id="blog">blog</div>
    </body>
    </html>



    --
    Brian O'Connor (ironcorona)
     
    ironcorona, May 8, 2006
    #11
  12. Guest

    yeah thanks, i'm coming to the same conclusion... just seems so silly
    and simple that IE can't handle it, i think i'll either wrap both in
    float left and right columns or use tables (ick). thanks again for all
    your help, and i'll post here if i ever figure it out :)
     
    , May 8, 2006
    #12
  13. Martin Jay Guest

    In message <>,
    writes
    >haha, no you were right the first time, i can't figure out why its
    >dropping in ie. i've set up another one at
    >http://footstops.dev01.alkaloid.net/test3.php that is super simple and
    >should illustrate my problem. In ie, when you reduce the width of the
    >browser, the bannerad will drop as its not a variable width like the
    >other two. in FF it hides tho, IE it drops.


    Is this the sort of effect you're looking for:

    <http://www.spam-free.org.uk/pages/blocks.html>

    The #outer_ie55 DIV is to make it work in IE5.5. :(
    --
    Martin Jay
    Phone/SMS: +44 7740 191877
    Fax: +44 870 432 5180
     
    Martin Jay, May 8, 2006
    #13
  14. Guest

    oh my god. you're my hero. i guess such a simple freakin problem has
    such a simple solution! Thanks a million, i was harbouring thoughts of
    tables!
     
    , May 8, 2006
    #14
  15. Guest

    all Martin did was add an empty div around the right hand side content.
    Its beyond me why this would make it work in ie but it does!
     
    , May 8, 2006
    #15
  16. ironcorona Guest

    wrote:
    > all Martin did was add an empty div around the right hand side content.
    > Its beyond me why this would make it work in ie but it does!


    I have a feeling it's more to do with the fact that he's used
    position:absolute; on #maps.

    The new div is only there for IE 5.5 I assume it's to make it think of
    the three divs on the right as being all one block.

    --
    Brian O'Connor (ironcorona)
     
    ironcorona, May 8, 2006
    #16
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Richard Rundle

    Use of overflow: hidden; on nested divs

    Richard Rundle, Dec 18, 2005, in forum: HTML
    Replies:
    0
    Views:
    685
    Richard Rundle
    Dec 18, 2005
  2. =?Utf-8?B?U0FM?=
    Replies:
    2
    Views:
    12,449
    =?Utf-8?B?U0FM?=
    Jul 28, 2006
  3. SolarCanine
    Replies:
    2
    Views:
    326
    SolarCanine
    Sep 20, 2005
  4. Ste
    Replies:
    41
    Views:
    856
    Thomas 'PointedEars' Lahn
    Aug 1, 2007
  5. Navneet Mathpal

    overflow:hidden not working fine

    Navneet Mathpal, Feb 24, 2014, in forum: HTML
    Replies:
    3
    Views:
    184
    dorayme
    Feb 24, 2014
Loading...

Share This Page