Kolinski Posted July 18, 2013 Share Posted July 18, 2013 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); } Quote Link to comment https://forums.phpfreaks.com/topic/280268-how-to-make-a-border-have-a-gradient/ Share on other sites More sharing options...
fastsol Posted July 18, 2013 Share Posted July 18, 2013 Check this out http://css-tricks.com/video-screencasts/95-a-tale-of-border-gradients/ Quote Link to comment https://forums.phpfreaks.com/topic/280268-how-to-make-a-border-have-a-gradient/#findComment-1441241 Share on other sites More sharing options...
Kolinski Posted August 7, 2013 Author Share Posted August 7, 2013 Thanks guys Quote Link to comment https://forums.phpfreaks.com/topic/280268-how-to-make-a-border-have-a-gradient/#findComment-1443769 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.