[SOLVED]tiny CSS question

[BoKr]

Hello

 

I want to have different colors for my buttons in the order process. Please, take a look at the 1st step of the order process.

 

 

That is near that I wanna achieve. However, I can not change the organge. It got orange since I commented out the exclusive_large from the button definition. Normally it would be blue as the two at the bottom.

So I tried to

input.button_mini, input.button_small, input.button, input.button_large, input.button_mini_disabled, input.button_small_disabled, input.button_disabled, input.button_large_disabled, input.exclusive_mini, button.exclusive_mini, input.exclusive_small, input.exclusive, /*input.exclusive_large,*/ input.exclusive_mini_disabled, input.exclusive_small_disabled, input.exclusive_disabled, input.exclusive_large_disabled, a.button_mini, a.button_small, a.button, a.button_large, a.exclusive_mini, a.exclusive_small, a.exclusive, a.exclusive_large, span.button_mini, span.button_small, span.button, span.button_large, span.exclusive_mini, span.exclusive_small, span.exclusive, span.exclusive_large, span.exclusive_large_disabled{
background-color: #0879d0 !important;
}
/* I tried a lot but no one of these selectors does the trick */
#carriercompare_submit input.exclusive_large,#carriercompare_submit .exclusive_large,#carriercompare_submit .button,#SE_SubmitRefreshCard .button, #SE_SubmitRefreshCard .exclusive_large {
  background-color: #98d420 !important;
}
}

 

I am no so into CSS nor HTML but I thought that #carriercompare_submit is the ID and by using the above I could assign a color exclusively for all exclusive_large buttons with the ID #carriercompare_submit

[vekia]

hello

 

without an access to the store is hard to say what is goin on there

it is possible to test your website? if so, please share the url

[BoKr]

Hi Milos,

 

good to see you here. The site in question is www.gruenes-spielzeug.de

 

It is based on a Template Maker theme by Stas.

 

 

As I said, my aim is to make the buttons that lead to the conversion (buttom right in the 5 step order process) more prominent. Since I am happy with the blue (Ikea, Ebay, Google ...) I tought about changing the others.

I my old template I just changed the buttons in the different *.tpl but I want to be a minimal invasive to my template as possible in order to have as less stress as possible when I update it (ps1.5.5 or so). Therefore I try to do as much as possible in the custom.css as it makes sense.

 

thank you

[vekia]

hello

 

can i create test account in your store ? it's necessary to see these buttons

[PascalVG]

Try to add this to the custom.css:

#carriercompare_submit {backround-color : green; }

#update_carriers_list {background-color : pink; }

 

(Change color as desired ;-) )

 

 

My $0.02,

pascal

 

 

 

Edit : sorry, used class selector instead of ID. Changed to #....

Edit 2: In real situation, {background-color: green !important; } was needed to overrule old !important

Edited July 31, 2013 by PascalVG
Oops sorry, used class instead of ID selector (see edit history)

[BoKr]

Vekia, feel free to create an account. I would be proud to call you one of our customers!

 

I tried Pascals tipp and it works partially. A first step though I thought I had to combine/mix class or ID with the button selector. But that did not work. Only the ID does it partially. Have a look:

 

I needed to use !important attribute.

 

the firebug

[PascalVG]

Haha! Found it!

 

See #carriercompare_submit {backround-color ...} the G is missing!!!

-> background-color :-)

 

Already started to doubt about myself ;-)

 

Hope this solves it,

pascal

[BoKr]

Oh gosh

 

I noticed something like that too since my css editor made me aware of that. See the screeni and the different colors!

 

But I stared at it for moments and again, looking away and staring again, and could see the G ?!!?

Damn, I think there must be something in the air

 

Thanks alot Pascal!

[PascalVG]

Glad it helped :-)

I'll mark this topic as solved...