#1
  1. No Profile Picture
    Contributing User
    Devshed Expert (3500 - 3999 posts)

    Join Date
    Jul 2003
    Posts
    3,617
    Rep Power
    595

    Positioning anchor links


    I have an index at the top of may page which are links to local anchors (obviously this is an FAQ page), typically.
    Code:
    <a href="#q1">Why does it tell me I have already downloaded my application?</a>
    When that linked is clicked, I want the anchor to be positioned at the top of the page. To do that I found some suggestions using CSS for the anchors. Without the CSS the links work but are positioned wrong. With the CSS the links don't work at all. The anchors typically look like:
    Code:
    <a name="q1" id="q1" class="anchor"></a>
    The CSS I tried is:
    Code:
    .anchor {
    	position:relative;
    	top: -50px;
    	float:left;
    }
    I don't think my CSS is wrong so I am guessing that my approach is wrong. Can someone help me accomplish what I want? TIA.
    There are 10 kinds of people in the world. Those that understand binary and those that don't.
  2. #2
  3. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2011
    Location
    The Pleiades
    Posts
    300
    Rep Power
    9
    Can you post your whole code you have please? Are you using any server-side or client-side scripting?

    I'm not sure on what your setup is, have you created individual pages for each anchor? Or do you stay on the same page and open the link content on the page where all the anchors are?

    Regards,

    NM.
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Expert (3500 - 3999 posts)

    Join Date
    Jul 2003
    Posts
    3,617
    Rep Power
    595
    I don't think I understand your question. There is no scripting at all, this is pure HTML. The whole code just consists of multiple <a> tags with anchor hrefs at the top followed by multiple paragraphs with corresponding anchor <a> tags as shown.
    There are 10 kinds of people in the world. Those that understand binary and those that don't.
  6. #4
  7. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2011
    Location
    The Pleiades
    Posts
    300
    Rep Power
    9
    So, when you click the anchor it takes you to a separate HTML page where you display the question with the content below it?

    Can you provide a live link at all?

    Regards,

    NM.
  8. #5
  9. No Profile Picture
    Contributing User
    Devshed Expert (3500 - 3999 posts)

    Join Date
    Jul 2003
    Posts
    3,617
    Rep Power
    595
    Originally Posted by Nanomech
    So, when you click the anchor it takes you to a separate HTML page where you display the question with the content below it?
    No, these are anchor labels. Everything is on the same page. You click on a link and it repositions the page to the content for that href (where the anchor label is). The problem is it positions the content for that anchor label such that it is in the middle of the page rather than at the top.
    There are 10 kinds of people in the world. Those that understand binary and those that don't.
  10. #6
  11. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2009
    Location
    Jakarta, Indonesia.
    Posts
    218
    Rep Power
    32
    As far as I know we couldn't control how HTML #anchor should behave. Maybe you should try scrollIntoView().
  12. #7
  13. No Profile Picture
    Contributing User
    Devshed Expert (3500 - 3999 posts)

    Join Date
    Jul 2003
    Posts
    3,617
    Rep Power
    595
    Thanks. From what I read, I thought it was possible without resorting to javascript. I guess what I read was a bogus solution.
    There are 10 kinds of people in the world. Those that understand binary and those that don't.

IMN logo majestic logo threadwatch logo seochat tools logo