text not floating on top of image

[greenhousegraphix]

Good Morning,

I created a sample page here: http://www.beautifulfaucets.com/CategoryPage2.HTML

You’ll see that in this page, the Bathroom Fixtures text overlays the image.

Basic structure:

Bathroom Fixtures

[additional code here]

the class catDescription has an absolute position applied to it.
.catDescription {
position: absolute;
top: 30%;
left: 0;
text-align: center;
width: 100%;
background:none;
opacity: 1.0;
text-shadow: 1px 1px 1px #000;
}

My sample page was applied to a live site: http://mountain3.myplumbingshowroom.com/Landingpage.HTML

On this second page, the Bathroom fixtures position is relative to the page rather than the enclosing div. Any ideas why?

[Paulie_D]

Because you forgot to apply position:relative to the parent

.catWrapper {
    position: relative;
}

[greenhousegraphix]

HI Paulie,
Thank you very much.
Amy

[Author]

Posts