Skip to content

Instantly share code, notes, and snippets.

@denmerc
Created February 12, 2013 05:30
Show Gist options
  • Save denmerc/4760464 to your computer and use it in GitHub Desktop.
Save denmerc/4760464 to your computer and use it in GitHub Desktop.
Untitled
.buttons{
border: 1px solid grey;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
height:84px;
width:600px;
overflow:hidden;
}
.buttons a, .buttons button{
float:left;
margin:0 7px 0 3px;
//background-color:#f5f5f5;
//border:1px solid #dedede;
//border-top:1px solid #eee;
//border-left:1px solid #eee;
font-family:"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
font-size:12px;
line-height:130%;
text-decoration:none;
font-weight:bold;
color:#565656;
cursor:pointer;
padding:5px 10px 6px 7px; /* Links */
}
.buttons a p{
//border: 1px solid black;
display: table;
}
.buttons a span{
display: table-cell;
vertical-align: middle;
padding-left:10px
}
.buttons button img, .buttons a img{
padding:0;
border:none;
width:50px;
height:50px;
vertical-align:middle;
//display:inline-block;
}
<!-- content to be placed inside <body>…</body> -->
<div class="buttons">
<a name="save">
<p><img src="images/apply2.png" alt=""/>
Web Design</p>
</button>
<a href="#">
<p> <img src="images/cross.png" alt=""/> <span>Motion <br/> Graphics</span></p>
</a>
<a href="" class="regular"><!-- class="regular"-->
<p><img src="images/textfield_key.png" alt=""/>
Illustrate</p>
</a>
<a href="" class="regular"> <p> <img src="images/textfield_key.png" alt=""/> <span>Photo <br/>Manipulation</span></p>
</a>
</div>
</form>
// alert('Hello world!');
{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment