-3

EDIT: From my previous post, none of the answers can satisfy my needs so I created a jsfiddle here to be more clear.

I am having an issue about my anchor tag.

I have created a jsfiddle

http://jsfiddle.net/7tMy5/

When I click my links, it will jump to the contents div. However, it seems like the content div is covered by the header div which has position:fixed specified. I want the contents jump to below my header div. How do I fix this?

I can't really change the my header div css property here...

Thanks for the help

FlyingCat
  • 14,036
  • 36
  • 119
  • 198
  • Your code seems to work as designed here. It would be very useful to just cut the `position: fixed`. You don't really need it. – Joe Pigott Oct 03 '13 at 01:38
  • I know JoshC. I just created a jsfiddle here for people to look at. I am really desperate now. – FlyingCat Oct 03 '13 at 01:39
  • I will need the position:fixed because my other contents need to have it. – FlyingCat Oct 03 '13 at 01:40
  • @FlyingCat Maybe just cut the height down on `#header`. This would make the content show more. About making it jump below `#header`, You would need it to jump to a specific place. To me it sounds complicated. – Joe Pigott Oct 03 '13 at 01:44
  • @JJP I can't cut down the height of the header. that's the problem..:( – FlyingCat Oct 03 '13 at 01:45
  • @FlyingCat [jsFiddle](http://jsfiddle.net/3ZKpy/). I just cut down the size. What browser are you using? – Joe Pigott Oct 03 '13 at 01:48
  • @JJP chrome. I need to show the full size of the header which is 200px. – FlyingCat Oct 03 '13 at 01:51
  • The solution I posted on your original question works - http://jsfiddle.net/ZFDUF/ – Josh Crozier Oct 03 '13 at 01:52
  • 1
    @FlyingCat Why? You don't even have one full line of text. You are pretty much wasting space in `#header` – Joe Pigott Oct 03 '13 at 01:52
  • My jsfiddle is just for demo purpose. I can't really put all my contents in jsfiddle. – FlyingCat Oct 03 '13 at 02:03
  • 1
    Creating a new question is not the way to get more attention on your problem. Edit your original question with the new information and try giving out [bounties](http://stackoverflow.com/help/bounty). – hjpotter92 Oct 03 '13 at 02:09
  • @JoshC could you please modify my jsfiddle? My brain really fried now. – FlyingCat Oct 03 '13 at 02:15

1 Answers1

2

You mean something like this http://jsfiddle.net/7tMy5/8/ I got this code from http://www.pixelflips.com/blog/anchor-links-with-a-fixed-header/ check it out and see if this is what you wanted to achieve

<span class="anchor" id="section1"></span>
<div class="section"></div>

<span class="anchor" id="section2"></span>
<div class="section"></div>

<span class="anchor" id="section3"></span>
<div class="section"></div>

This is pretty much the new html markup for the page