html - Text Over Image Isn't Working -
i'm trying put text on image , isn't working. puts text under image , can't bring up.
my code:
.happylady { position: relative; width: 100%; } .happylady p { float: left; position: absolute; left: 0; top: 80px; width: 100%; }
<div class="bannerimage"> <img src="content/severroom.png" class="centerimage" /> <p>check out speeds 60mbps!</p> <a href="/cable/"><button >view packages!</button></a> </div> <div class="internet"> <div class="information"> <h3>internet</h3> <h7>cable, dsl & rural wireless</h7> </div <div class="happylady"> <img src="content/happylaptoplady.png" alt="" /> <div class="contents"> <h4 class="pricing">from <span class="dollar">$29.99</span> per month!</h4> <div class="benefits"> <p>unlimited plans available</p> <p>now lower prices</p> <p>faster speeds - 60 mbps!</p> </div> </div> </div> </div> <div class="phone"> <h3>phone</h3> <h7>residential & commercial</h7> </div> <div class="television"> <h3>television</h3> <h7>shaw direct / internet tv</h7> </div>
edit: i've added entire html code... may show i'm going wrong.
your class misspelled in css , you're positioning paragraphs on top of each other. need wrap content in container , position it. won't need float.
.happylady { position: relative; width: 100%; } .happylady div.contents { position: absolute; left: 0; top: 80px; width: 100%; }
<div class="happylady"> <img src="http://placehold.it/400x400" alt="" /> <div class="contents"> <h4 class="pricing">from <span class="dollar">$29.99</span> per month!</h4> <div class="benefits"> <p>unlimited plans available</p> <p>now lower prices</p> <p>faster speeds - 60 mbps!</p> </div> </div> </div>
Comments
Post a Comment