Jump to content

How to make a border have a gradient?


Kolinski

Recommended Posts

Hi all, 

 

I'm working on a button which has a gradient from top to bottom using the colors #0072ba & #004881. 

 

I would like to create a 2px border around this button with the same gradient but reverse... so top being #004881.

 

How can I do this using CSS3 or any other methods. 

 

The code to the button is attached? 

 

Any help would be much appreciated :) 

a.CSS3_Button {
	position:relative;
	left:65px;
	top:100px;
	display: inline-block;
	border: 2px solid blue;
	padding: 8px 18px;
	width:590px;
	height:120px;
	z-index:1111111;
	text-decoration: none;
	color: #FFFFFF;
	font-size: 13px;
	font-weight: bold;
	font-family: GillSans;
	margin-bottom:35px;
	-webkit-box-shadow: 1px -1px 4px rgba(50, 50, 50, 0.66);
	-moz-box-shadow:    1px -1px 4px rgba(50, 50, 50, 0.66);
	box-shadow:         1px -1px 4px rgba(50, 50, 50, 0.66);
}
Link to comment
https://forums.phpfreaks.com/topic/280268-how-to-make-a-border-have-a-gradient/
Share on other sites

  • 3 weeks later...

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.