I have no idea why, but when I tell my h2 (which is now an image thanks to css) to have a top margin, it ALSO moves down the element that it is contained in: my "white div" (therefore there is an odd patch of green- a background element-between my nice white div and my button menu) Any imput would be helpful. I can't seem to think of anything else to try. To my knowledge everything should be working correctly, but there must be a mistake somewhere.
I couldn't find any "inherited misbehaviors"....so here is the code that applies. I'll post more if we still can't figure this out.
<div id="white">
<h2>Our Mission</h2>
<div id="p1">
<p>Paragraph1</p>
</div>
<div id="p2">
<p>Paragraph2</p>
</div>
<div id="p3">
<p>Paragraph3</p>
</div>
<div id="serviceicons">
<h3>Services</h3>
<dl>
<dt><a href="#">Icon</a></dt>
<dd>Writing Services</dd>
<dt><a href="#">Icon</a></dt>
<dd>Website Solutions</dd>
<dt><a href="#">Icon</a></dt>
<dd>Graphic Design</dd>
<dt><a href="#">Icon</a></dt>
<dd>Photography</dd>
</dl>
</div>
</div>
and here is the css:
#white{
width: 600px;
height: 775px;
padding-top: 0px;
margin-top: 0px;
margin-bottom:0px;
margin-right: auto;
margin-left: auto;
background-color: #fff;
border-right-style: solid;
border-right-color: #fff;
border-right-width: 1px;
border-left-style: solid;
border-left-color: #fff;
border-left-width: 1px;
}
#white h2 {
width: 164px;
height: 48px;
margin: 0;
text-indent: -5000px;
padding-left: 10px;
background: url(images/mission.png) no-repeat;
}
Ironically the paragraphs and other elements in "white div" act perfectly normal. I cannot figure out what is going on with my h2! Thank you for taking a look.  |
LOL.. thank you 
I am a self-confessed GEEK, no offense taken. However, I have been doing this stuff for a LOT of years!
