Change Button Color
-
How can I change the “send” background color from orange to black in CSS?
-
Search your theme css. Open with editor and search: background: linear-gradient(to left, rgba(0,0,0,.3), rgba(0,0,0,.0) 50%, rgba(0,0,0,.3)), linear-gradient(#d77d31, #fe8417, #d77d31);
I don’t see any “to left” to apply this to. Here is what my editor reads. Can you guide me here? Thanks!
/* Form fields, general styles first. */ button, input, textarea { border: 2px solid #d4d0ba; font-family: inherit; padding: 5px; } input, textarea { color: #141412; } input:focus, textarea:focus { border: 2px solid #c3c0ab; outline: 0; } /* Buttons */ button, input[type=”submit”], input[type=”button”], input[type=”reset”] { background: #e05d22; /* Old browsers */ background: -webkit-linear-gradient(top, #e05d22 0%, #d94412 100%); /* Chrome 10+, Safari 5.1+ */ background: linear-gradient(to bottom, #e05d22 0%, #d94412 100%); /* W3C */ border: none; border-bottom: 3px solid #b93207; border-radius: 2px; color: #fff; display: inline-block; padding: 11px 24px 10px; text-decoration: none; } button:hover, button:focus, input[type=”submit”]:hover, input[type=”button”]:hover, input[type=”reset”]:hover, input[type=”submit”]:focus, input[type=”button”]:focus, input[type=”reset”]:focus { background: #ed6a31; /* Old browsers */ background: -webkit-linear-gradient(top, #ed6a31 0%, #e55627 100%); /* Chrome 10+, Safari 5.1+ */ background: linear-gradient(to bottom, #ed6a31 0%, #e55627 100%); /* W3C */ outline: none; } button:active, input[type=”submit”]:active, input[type=”button”]:active, input[type=”reset”]:active { background: #d94412; /* Old browsers */ background: -webkit-linear-gradient(top, #d94412 0%, #e05d22 100%); /* Chrome 10+, Safari 5.1+ */ background: linear-gradient(to bottom, #d94412 0%, #e05d22 100%); /* W3C */ border: none; border-top: 3px solid #b93207; padding: 10px 24px 11px;[Moderator note: code fixed. Please wrap code in the backtick character or use the code button.]
-
This reply was modified 9 years, 3 months ago by
bdbrown.
Do you want to change the color or do you want to add a background image?
Is that code the button?
You know the color is? example: #xxxxxxI’d like to change the background color of the button. The button should be black and the text should be white.
Maybe I’m looking in the wrong place?
Tell me what your theme is called and where to download, I’ll install and search.
I’m using a Twenty Thirteen Child Theme. Thank you.
Any luck?
Child Theme?
Look for this
you site\wp-content\themes\twentythirteen\style.css
Is the same code that you uploaded, the one up.
Change the following color: #e05d22,#d94412 for: #000Resultado:
/* Buttons */ button, input[type=”submit”], input[type=”button”], input[type=”reset”] { background: #000; /* Old browsers */ background: -webkit-linear-gradient(top, #000 0%, #000 100%); /* Chrome 10+, Safari 5.1+ */ background: linear-gradient(to bottom, #000 0%, #000 100%); /* W3C */ border: none; border-bottom: 3px solid #b93207; border-radius: 2px; color: #fff; display: inline-block; padding: 11px 24px 10px; text-decoration: none; }[Moderator note: code fixed. Please wrap code in the backtick character or use the code button.]
-
This reply was modified 9 years, 3 months ago by
bdbrown.
You can also change the color border:
border-bottom: 3px solid #b93207; 🙂Awesome thank you! This worked!
Would you by chance be able to answer another formatting question? It’s CSS or php specific. I can’t figure out how to increase my catalog images in size in my shop, while keeping 4 images per row on my desktop and 2 images per row on my mobile. If you’re able to answer this I’ll disable my maintenance page after a reply.
Thank you!
I need to know which catalog plugin you are using.
you site? semaystudio.comWooCommerce! For http://www.semaystudio.com
Also, my MailChimp embedded signup form on my FOOTER has green text saying “thank you for signing up” once somebody does. Do you know how I can turn this to white text instead of green?
I’ve reached out to MailChimp, but they said its coding specific with WordPress.I’ll make you a video tutorial to learn.
-
This reply was modified 9 years, 3 months ago by
The topic ‘Change Button Color’ is closed to new replies.