Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New Coder
    Join Date
    Jan 2004
    Posts
    56
    Thanks
    2
    Thanked 0 Times in 0 Posts

    frame moving up and down when browser resized

    hi chaps

    I use frames in my site, and instead of the bottom frame being stuck to the frame above it like I want, it moves up and down when the browser is re-sized.

    Is it possible to fix it so it doesn't move


    thanks

    Masten

  • #2
    Senior Coder
    Join Date
    Jun 2002
    Location
    Nashua, NH
    Posts
    1,724
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re: frame moving up and down when browser resized

    Originally posted by masten
    hi chaps

    I use frames in my site,
    <snip />
    There is your problem, everything else is just a consequence
    Vladdy | KL
    "Working web site is not the one that looks the same on common graphical browsers running on desktop computers, but the one that adequately delivers information regardless of device accessing it"

  • #3
    me'
    me' is offline
    Senior Coder
    Join Date
    Nov 2002
    Location
    Warwickshire, England
    Posts
    1,229
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Instead, try:
    Code:
    div#footer { position: fixed; bottom: 0 }
    With this for IE.
    David House - Perfect is achieved, not when there is nothing left to add, but when there is nothing left to take away. (Antoine de St. Exupery).
    W3Schools | XHTML Validator | CSS Validator | Colours | Typography | HTML&CSS FAQ | Go get Mozilla Now | I blog!

  • #4
    New Coder
    Join Date
    Jan 2004
    Posts
    56
    Thanks
    2
    Thanked 0 Times in 0 Posts
    vladdy: yeah I know professional hate frames but I dont know to do it any other way...

    me': im not a professional coder so Im not with you...

    how does:

    div#footer { position: fixed; bottom: 0 }

    help me...

    how do I implement that in the code, what do I attatch it to, does it go in the frameset of the frame???

    many thanks

    Masten

  • #5
    me'
    me' is offline
    Senior Coder
    Join Date
    Nov 2002
    Location
    Warwickshire, England
    Posts
    1,229
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Okay. Frames are bad: they're hard to bookmark, hard when you want to open a duplicate of that page, hard to navigate a lot of the time. Apart from that, a lot of the code you have to use is non-standard and it all ends up a mess. In several different documents.

    So, instead, if we want a part of the page to stay in a fixed position, we first mark it up as a part of the page:
    Code:
    <div id="fixedbit">
    
    content here
    
    </div>
    Note I've given it an ID to make it easy to identify. We then use something called CSS, which we should always use to tell the browser entirely how the page looks (all 'presenetational' tags in HTML like <font>, <b>, <i> are bad: imagine a machine that converts a page into braille. How would it react to <b>? It would have to do something to it that wouldn't be making it bold. That tag is a problem.) to make this div stay fixed. If you've never seen CSS before, check out the awesome tutorial over at w3schools. This is the CSS we use:
    Code:
    div#fixedbit { position: fixed; bottom: 0 }
    What this says is, 'Any div with an id of 'fixedbit' (# is the 'ID selector'): it needs to be fixed in respect to the viewport (so it won't move with the scrollbar), and it's bottom edge needs to be 0 pixels away from the bottom edge of the containing object (in this case the screen)'.

    Thus, it emulates frames.

    We have on problem: the most popular browser, Microsoft Internet Explorer (or IE) doesn't support position: fixed;. We have to use a different method. This page described that method.

    Now, you didn't have to be a professional coder to understand that after all
    David House - Perfect is achieved, not when there is nothing left to add, but when there is nothing left to take away. (Antoine de St. Exupery).
    W3Schools | XHTML Validator | CSS Validator | Colours | Typography | HTML&CSS FAQ | Go get Mozilla Now | I blog!

  • #6
    New Coder
    Join Date
    Jan 2004
    Posts
    56
    Thanks
    2
    Thanked 0 Times in 0 Posts
    me'

    OK, I get the first bit,

    I use:

    <div id="fixedbit">

    content here

    </div>


    and:

    div#fixedbit { position: fixed; bottom: 0 }




    but then the second bit about the fix for IE says use this:

    body
    {
    overflow: hidden;
    }
    div.content
    {
    height: 100%;
    overflow: auto;
    }


    so which do I use?

    many thanks

    Masten


  •  

    Posting Permissions

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