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

Popular posts from this blog

commonjs - How to write a typescript definition file for a node module that exports a function? -

openid - Okta: Failed to get authorization code through API call -

ios - Change Storyboard View using Seague -