position page fragment (anchor) on top of page.

Discussion in 'HTML' started by Erwin Moller, Jul 27, 2012.

  1. Erwin Moller

    Erwin Moller Guest

    I have a page with multiple repeating divs that display history-entries
    for some thing I am developing.
    Each div contains an "edit" and "delete" icon.
    When edit is clicked, the page reloads with the clicked item open for edit.
    It will be positions on top of the page via an anchor
    (mypage.php?histid=2345#edit).
    That is all fine. The user clicks the item, and it appears on top of the
    page in editmode (with a form), and all others are just displayed in
    display/view mode (no form).

    However, I also have a "new entry" link, that opens a form at the bottom
    of the page (mypage.php#new).
    To get this also on top of the page, I add a bunch of <br> under that
    form, otherwise the form will be low on the screen, since it is the last
    thing displayed on the document.

    My question: I somehow dislike these stupid <br> at the end of my
    document. For myself, if I look at a page, I often scroll down to see
    what is there, but in this case it is only empty space.
    So all those <br> feel somehow like a stupid solution.

    I wonder if anybody has any suggestions for a cleaner solution.

    Note: I try to develop in such a way that my visitors don't need
    Javascript to use the webpage.

    Regards,
    Erwin Moller

    --
    "That which can be asserted without evidence, can be dismissed without
    evidence."
    -- Christopher Hitchens
     
    Erwin Moller, Jul 27, 2012
    #1
    1. Advertising

  2. Erwin Moller

    dorayme Guest

    In article <50125000$0$6871$4all.nl>,
    Erwin Moller <> wrote:

    > I have a page with multiple repeating divs that display history-entries
    > for some thing I am developing.
    > Each div contains an "edit" and "delete" icon.
    > When edit is clicked, the page reloads with the clicked item open for edit.
    > It will be positions on top of the page via an anchor
    > (mypage.php?histid=2345#edit).
    > That is all fine. The user clicks the item, and it appears on top of the
    > page in editmode (with a form), and all others are just displayed in
    > display/view mode (no form).
    >
    > However, I also have a "new entry" link, that opens a form at the bottom
    > of the page (mypage.php#new).
    > To get this also on top of the page, I add a bunch of <br> under that
    > form, otherwise the form will be low on the screen, since it is the last
    > thing displayed on the document.
    >
    > My question: I somehow dislike these stupid <br> at the end of my
    > document. For myself, if I look at a page, I often scroll down to see
    > what is there, but in this case it is only empty space.
    > So all those <br> feel somehow like a stupid solution.
    >
    > I wonder if anybody has any suggestions for a cleaner solution.
    >
    > Note: I try to develop in such a way that my visitors don't need
    > Javascript to use the webpage.
    >



    Yes, <br>s are a little inelegant. I guess not much better is an empty
    last DIV styled to have a height at least to the number of BRs you
    were using.

    Another way would be to have the form off the page and linked to a
    separate page, that would mean a different design (something I would
    have no hesitation in doing and keeping pages short and
    single-purposed).

    If you are really wanting it to be on the same page, perhaps something
    like the following, maybe you can play with the percentage assigned to
    the last DIV to suit your purpose if you don't think it as inelegant
    as the BRs (the width to body is merely to exacerbate the height for
    the demo, you would not need it. I also use Ps instead, not important
    though:

    html, body {height: 100%;}
    body {width: 8em;}
    #lastItem {height: 100%;}

    <body>
    <p>
    <a href="#lastItem">Last Item link</a> Cras vel eros. Vivamus
    sed odio et orci tincidunt ornare. Duis dui lectus, commodo ut,
    gravida id, ultricies quis, tellus. Vestibulum blandit nibh eget
    turpis. Quisque mollis, lacus consectetur eleifend convallis, diam
    augue blandit magna. And more of the same...
    </p>
    <p>
    Cras vel eros. Vivamus sed odio et orci tincidunt ornare. Duis
    dui lectus, commodo ut, gravida id, ultricies quis, tellus. Vestibulum
    blandit nibh eget turpis. Quisque mollis, lacus consectetur eleifend
    convallis, diam augue blandit magna. And more of the same...
    </p>
    <p>
    Cras vel eros. Vivamus sed odio et orci tincidunt ornare. Duis
    dui lectus, commodo ut, gravida id, ultricies quis, tellus. Vestibulum
    blandit nibh eget turpis. Quisque mollis, lacus consectetur eleifend
    convallis, diam augue blandit magna. And more of the same...
    </p>
    <p id="lastItem">
    <b>Last item</b> Cras vel eros. Vivamus sed odio et orci
    tincidunt ornare. Duis dui lectus, commodo ut, gravida id, ultricies
    quis, tellus. Vestibulum blandit nibh eget turpis. Quisque mollis,
    lacus consectetur eleifend convallis, diam augue blandit magna. And
    more of the same...
    </p>
    </body>

    --
    dorayme
     
    dorayme, Jul 27, 2012
    #2
    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. Frederic HOUDE
    Replies:
    4
    Views:
    622
    Frederic HOUDE
    Aug 31, 2004
  2. Cuthbert
    Replies:
    8
    Views:
    455
    Ancient_Hacker
    Sep 13, 2006
  3. Bernhard Sturm

    #top anchor doesn't work in FF

    Bernhard Sturm, Oct 31, 2007, in forum: HTML
    Replies:
    25
    Views:
    3,236
    dorayme
    Nov 1, 2007
  4. AAaron123
    Replies:
    6
    Views:
    606
    AAaron123
    Nov 5, 2009
  5. axlq
    Replies:
    3
    Views:
    130
Loading...

Share This Page