CSS button style

**Thordendal** · Oct 21, 2012 18:20

Hi guys,

Just wondering how you would create this button with just CSS (image attached)?

I can't work out how to get the border inside the button.

Any help is greatly appreciated.

Cheers
Jed

Screen shot 2012-10-22 at 10.43.20 AM.png

**ralph.m** · Oct 21, 2012 18:57

You might have to wrap one element inside another to get that. E.g.

Code:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Link</title>
	
<style media="all">
a, span {
	display: inline-block;
}

a {
	background: #4e95be;
	color:white;
	font-size: 0.75em;
}

a:hover {
	background: #2376a6;
}

span {
	padding: 10px 20px;
	margin: 5px;
	border: 1px solid white;
}
</style>
	
</head>

<body>

<p><a href=""><span>VIEW ALL</span></a></p>

</body>

</html>

**Thordendal** · Oct 21, 2012 19:05

Thanks Ralph – that's great...

Thanks for your assistance.

Jed

User Tag List

Thread: CSS button style

Thread Tools

Display

CSS button style

Bookmarks

Bookmarks

Posting Permissions