HTML+CSS Formatting a button with <a> and <h> -
i've started learning html , css, , i've got problem:
http://i.stack.imgur.com/npkl9.png
the 3 buttons "spausk mane" should have text @ bottom of box, or 10px off bottom centered. line-height, margins etc. aren't working reason. hover settings doesn't work them, because think went wrong somewhere 'h3' , 'a' tag formatting, help? :s
html:
<div class="cta-wrap cf"> <a href="#" class="cta"><h3>spausk <br> mane</h3></a> <a href="#" class="cta"><h3>spausk <br> mane</h3></a> <a href="#" class="cta"><h3>spausk <br> mane</h3></a> </div>
css:
a.cta { color:white; text-decoration: none; text-align: center; } a:hover.cta {} .cta h3 { background-color:#287d7d; width: 150px; height: 110px; float:left; margin: 0px 20px 10px 20px; }
style single line text buttons way make them fat , centered (vertically):
height: 110px; line-height: 110px;
if plan on having wrapped text in buttons can use:
padding: 3em 0;
Comments
Post a Comment