CSS Button

Posted in: Newsmag
Post count: 6

Hi,

I put these code that i obtain on the website http://css3buttongenerator.com/² on my newsmag theme in the custom css:

.btn {
background: #3498db;
background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
background-image: -moz-linear-gradient(top, #3498db, #2980b9);
background-image: -ms-linear-gradient(top, #3498db, #2980b9);
background-image: -o-linear-gradient(top, #3498db, #2980b9);
background-image: linear-gradient(to bottom, #3498db, #2980b9);
font-family: Arial;
color: #ffffff;
font-size: 20px;
background: #3498db;
padding: 15px 25px 15px 25px;
text-decoration: none;
}

.btn:hover {
text-decoration: none;
}

I put that on my website in the widget part on the sidebar, the problem is that the result is different from the website http://css3buttongenerator.com/. Can you help me to optimize these css code for your theme?

Regards

Post count: 6535

Hi

I am not sure for which element you tried to apply this css so please provide your site url and also more details about this problem, so I can inspect it closer.

Thanks!

  • This reply was modified 10 years by Andrei L..
Post count: 6
Post count: 6535

Hi

Remove the previous code from theme panel and add this one: http://screencast.com/t/LLMU9Djcj0yc

.prot{
background: #3498db;
background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
background-image: -moz-linear-gradient(top, #3498db, #2980b9);
background-image: -ms-linear-gradient(top, #3498db, #2980b9);
background-image: -o-linear-gradient(top, #3498db, #2980b9);
background-image: linear-gradient(to bottom, #3498db, #2980b9);
-webkit-border-radius: 28;
-moz-border-radius: 28;
border-radius: 28px;
font-family: Arial;
color: #ffffff!important;
font-size: 20px;
padding: 10px 20px 10px 20px;
text-decoration: none;
}
.prot:hover {
background: #3cb0fd;
background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
text-decoration: none;
}

Let me know how it goes.
Thanks!

Post count: 6

It works thanks!

Viewing 5 posts - 1 through 5 (of 5 total)
The forum ‘Newsmag’ is closed to new topics and replies.