Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 5 of 5
  1. #1
    Senior Member Jack000's Avatar
    Join Date
    Aug 2004
    Posts
    250
    Member #
    7173
    Hi

    I'm working on my blog design, and there's just one problem I can't seem to get around.

    here's a simplified version of my code:
    Code:
    html:
    
    <div id="box_outside">
    
    <a id="box_inside"></a>
    
    </div>
    
    css:
    
    #box_outside {
    position: absolute;
    }
    
    #box_inside {
    display: block;
    position: absolute;
    bottom: 0;
    }
    the problem is that when I specify "overflow:hidden" for the outer box, the inner box disappears. The inner box is within the bounds of the outer box, so I don't understand why this is happening.

    the layout in question is here: www.pureweb.ca/blog2
    click on the little arrow box under the post and you'll see why I need overflow:hidden..

    thanks for any tips :]

  2.  

  3. #2
    Senior Member seanmiller's Avatar
    Join Date
    Sep 2003
    Location
    Glastonbury, UK
    Posts
    868
    Member #
    3263
    Liked
    1 times
    You mean the line with the arrow to click disappears when overflow is set to hidden, right?

    Just looking into it...

    Sean

  4. #3
    Senior Member seanmiller's Avatar
    Join Date
    Sep 2003
    Location
    Glastonbury, UK
    Posts
    868
    Member #
    3263
    Liked
    1 times
    If you set overflow to "auto" rather than hidden you'll see that your arrow line is causing the div to overflow (ie. scrollbars).

    If your "p" element was of a fixed height then you would not have the issue - I have not tried to anchor an element at the bottom of a fluid paragraph before so have not seen this behaviour but it appears to be that which is causing the "overflow"... it's very curious... if you set the "p" element to have a height (eg. 100, 300) then there is no issue... I have googled for anybody else experiencing this behaviour and cannot find a thing...

    I've had a go for half an hour but unfortunately can't seem to get my head around it at all... if I manage to get any further I'll re-post.

    Sean

  5. #4
    Senior Member Jack000's Avatar
    Join Date
    Aug 2004
    Posts
    250
    Member #
    7173
    thanks a lot :]

    maybe I have to start thinking of alternate approaches to this..

  6. #5
    Senior Member Jack000's Avatar
    Join Date
    Aug 2004
    Posts
    250
    Member #
    7173
    Hi again

    I've found a way around my previous problem, but there's another one I can't seem to get a grasp on..

    the problem code is
    Code:
    shrinks[i].lastChild.onclick = adsf(shrinks[i]);
    it's supposed to passes a node to the "adsf" function when the lastChild is clicked, which is supposed to shrink the node. The problem is that it does this whether or not I click on the lastChild (the button with the arrow), so all the boxes become closed on page load. I'm thinking it's just some kind of syntax problem.. but I'm still very new to this so I can't be sure..

    the link is the same

    thanks for any help :]


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 06:19 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com