BuddyPress.org

Thanks @modemlooper. I have been asking at Woo Themes but no reply yet. If I hear anything I will post here too, to help others.

However, these IE8/9 problems with the WooCommerce buttons go away when I switch to twentytwelve theme and return when I switch back to BuddyPress Default Theme (I’m now on the latest BuddyPress 1.7 version and the problem is still there). So I’m guessing that the fix needs to be done in the BuddyPress Default Theme to make it work with WooCommerce (rather than the other way around)- would you agree with this logic?

Thanks @aces

I’ve been trying your suggestions and am getting closer I think, but I’m still a bit out of my league so wondering if you or anyone else can help a bit more please.

In the absence of anything in my child theme, should the WooCommerce button CSS always override the BuddyPress default.css? ….Or are there ways that the BuddyPress default.css can win out? For example if both have the same named a.button…etc. definitions which may conflict with each other, which one wins out?

Here is the a.button code from WooCommerce to compare with 1720 of bp’s default.css. I don’t understand it well enough to work out the conflict, or how to hack either to fix it, or better still how to add something into my child theme to fix it. Any ideas gratefully received?

` /* =Buttons
————————————————————– */

a.button, button.button, input.button, #respond input#submit, #content input.button {
font-size: 100%;
margin: 0;
line-height: 1em;
cursor: pointer;
position: relative;
font-family: inherit;
text-decoration:none;
overflow: visible;
padding: 6px 10px;
text-decoration:none;
font-weight:bold;
.border_radius(2px);
left: auto;
text-shadow:0 1px 0 @secondary + #111;
color: @secondarytext;
.darkorlighttextshadow( @secondarytext );
border: 1px solid darken( @secondary, 20 );
.vertical_gradient( @secondary, darken( @secondary, 10 ) );
white-space: nowrap;
display: inline-block;

-webkit-box-shadow:
inset 0 -1px 0 rgba(0,0,0,0.075),
inset 0 1px 0 rgba(255,255,255,0.3),
0 1px 2px rgba(0,0,0,0.1);
-moz-box-shadow:
inset 0 -1px 0 rgba(0,0,0,0.075),
inset 0 1px 0 rgba(255,255,255,0.3),
0 1px 2px rgba(0,0,0,0.1);
box-shadow:
inset 0 -1px 0 rgba(0,0,0,0.075),
inset 0 1px 0 rgba(255,255,255,0.3),
0 1px 2px rgba(0,0,0,0.1);

&.loading {
color: lighten( @secondarytext, 10 );
border: 1px solid @secondary;

&:before {
content: “”;
position:absolute;
top: 0;
right: 0;
left: 0;
bottom: 0;
background: url(../images/ajax-loader.gif) center no-repeat rgba(255,255,255,0.65);
}
}

&.added {
&:before {
content: “”;
position:absolute;
height: 16px;
width: 16px;
top: 0.35em;
right: -26px;
text-indent: 0;
background: url(../images/success.png) no-repeat;
}
}

&:hover {
.vertical_gradient( @secondary, darken( @secondary, 15 ) );
text-decoration:none;
}

&:active {
top: 1px;
}

&.alt {
.vertical_gradient( @primary, darken( @primary, 10 ) );
border-color: darken(@primary, 20);
color: @primarytext;
.darkorlighttextshadow( @primarytext, 0.6 );

&:hover {
.vertical_gradient( @primary, darken( @primary, 15 ) );
color:@primarytext + #111;
.darkorlighttextshadow( @primarytext + #111, 0.6 );
}
}
}

.cart .button, .cart input.button {
float:none;
}

a.added_to_cart {
padding-top: .5em;
white-space: nowrap;
display: inline-block;
}`

Here is a link to a post I started on the WooCommerce forum which gives some more info about how I am working around this conflict at the moment, whilst still trying to get a fix –
https://wordpress.org/support/rss/topic/woocommerce-205-cart-button-colours-not-workinbg-on-ie89

Many thanks for any help and I hope it helps some others too.