Getting irritated

[two4god07]

On the about page of the church site I'm working in (they finally gave me some content to add) I'm trying to set up a sitemap type look with anchors.

My problem is, the anchored object goes to the very top of the page when clicked. This is an issue because the top of the page has a z-index header. All the text goes up under that header. Is there any way I can make it appear below the header?

here is my css

#banner {

position: fixed; top: 0; left: 10%; z-index:1;

border-bottom: thick solid maroon;}

#toc {

position: fixed; top: 30%; left: 10%;

padding-top: 15px;

padding-left: 20px;

background: #CDBE70; width: 129px; height: 500px;

border-right: medium solid maroon;

}

#content {

padding-left: 20px;

padding-right: 20px;

padding-top: 15px;

position: absolute; top: 31%; left: 22%;

background: #CDBE70;

width: 672px; height: 500px;

background-attachment: fixed;

}


I double checked to make sure I set up the anchors right, and they are. And I removed the z-index temporarily to find out if that was the problem, it was. The only thing I personally can think of is removing my link to the stylesheet and typing a brandnew one for the about us page.

Any different ideas?

[Fang]

and the html?

[two4god07]

<div id="content">
<div id="blv">
<h3>About Us</h3>
<ul>
<li><a href="#are">Who We Are</a></li>
<li><a href="#mission">Our Mission</a></li>
<li><a href="#purpose">Our Purpose</a></li>
<li><a href="#strat">Our Strategy</a></li>
<li><a href="#value">Our Core Values</a></li>
<li><a href="#believe">What We Believe</a> (Coming Soon)</li>
</ul>
</div>
<h3 id="are">Who We Are</h3></a>

This is a sample of the target links and the first target.

[WebJoel]

<div id="content">
<div id="blv">
<h3>About Us</h3>
<ul>
<li><a href="#are">Who We Are</a></li>
<li><a href="#mission">Our Mission</a></li>
<li><a href="#purpose">Our Purpose</a></li>
<li><a href="#strat">Our Strategy</a></li>
<li><a href="#value">Our Core Values</a></li>
<li><a href="#believe">What We Believe</a> (Coming Soon)</li>
</ul>
</div>
<h3 id="are">Who We Are</h3></a> When I see partial code (not the entire page from "<!doctype....>" to "</html>", things like this closing "</a>" tag are disturbing. -Makes me wonder what else is wrong... :o

Case in point: your HTML includes this: <div id="blv"> but you provided no CSS for the "#blv" so, -I can't even begin to guess what is missing here. :)

[two4god07]

I just fixed it up so the whole thing scrolled instead of setting it up so the banner stayed in place.