button irregularities

In the themes we’ve tested with the offer button does follow the general theme button style by default.

From what I can tell you’ve pretty much got this matching already..?? Looks like changing the font-size to 11px makes it match the button a little better.

Ah, I just noticed you had mentioned the orange color on mouseover. I’m guessing there could be some sort of jQuery going on there because I’m not seeing anything with a quick review of the CSS.

We could figure it out for you, but this would be something that would require a premium support order.

@danielriera1

1. The CSS you have here has !important on it, so it is preventing the onHover color style; So take that out. And you used #main-wrapper on the .single_add_to_cart_button you used #main-wrapper, but you did not on the second part of it, so that is not quite correct.

This is not correct:

#main-wrapper .single_add_to_cart_button,
.offers-for-woocommerce-make-offer-button-single-product.button {
    background: #323436 none repeat scroll 0% 0% !important;
}

2. The proper CSS to have to override the background color would be to either set the .button.alt css for woocommerce css, OR here is a line to add to your theme’s CSS:

Please try this:

#main-wrapper .offers-for-woocommerce-add-to-cart-wrap.ofwc-button-right-of-add-to-cart .offers-for-woocommerce-make-offer-button-single-product { background: #323436; }

If you plan to display the Make Offer button on archive views like the shop page loop or related products, then you’ll need to override in the same way — Make sure you include the #main-wrapper on the style override and do not include !important.

Let us know if that worked for you, good luck!

Thanks for stepping in and helping @kcwebmedia!

@danielriera1, I’m going to mark this resolved, but let me know if you have any other questions or problems getting that working.

@danielriera1

I failed to give you answer on the font size and height. Use this CSS:

#main-wrapper .offers-for-woocommerce-add-to-cart-wrap.ofwc-button-right-of-add-to-cart .offers-for-woocommerce-make-offer-button-single-product {
	background: #323436;
	height: 40px;
	line-height: 40px;
	padding: 0 25px;
	font-size: 12px;
	letter-spacing: 1.5px;
	font-size:12px;
}

Good luck!

Kcwebmedia, by any chance you are for hire? lol

After a couple days on several forums I finally found someone that could fix the issue at hand! Thank you so very much. I took out the duplicate font-size and added “Text-Transform” now its perfect!

Thank you again!
Daniel Riera

Final CSS code that did the trick:
#main-wrapper .offers-for-woocommerce-add-to-cart-wrap.ofwc-button-right-of-add-to-cart .offers-for-woocommerce-make-offer-button-single-product {
background: #323436;
height: 40px;
line-height: 40px;
padding: 0 25px;
font-size: 12px;
letter-spacing: 1.5px;
text-transform: uppercase;
}