Trouble adding CSS to my page?

Classic General
1

I’m trying to add CSS to increase the font size of the “Send Mail” button text on this page which uses Doobox’s contact form stack.

http://thriftycabinets.com/page2/

I cannot get my custom CSS to override the stylesheet’s CSS. I can inspect the element in RW and find the CSS, change it in the developer’s tools console window and see the change, but nothing happens when I enter the same value in the CSS tab of my page in the RW inspector window. The screen shot shows I set the height to 16px, but it still displays as 12px. What do I need to do to make this work?

Screen Shot 2015-08-20 at 8.07.04 AM.png838×728 160 KB

2

Bruce,

A quick ‘Inspect Element with Firebug’ of that pages suggests you’re doing the right thing.

Changing it there to an absurdly high value - just to be sure - 60px, does suggest it’s the place to do so.

If that helps, there’s some other part of the necessary workflow that’s not included.

mailbutton.png1448×597 207 KB

3

Yes, that’s what I need help with.

4

Try:

.stacks_in_311_page2sendmail {
    font-size: 16px !important;
}

Might be worth a try.

1 Like
5

kryten, Fabulous! Worked like a charm. Is it the “!important” syntax that clues RW to override the CSS code?

6

Hello,
Sorry for the delay there.

The !important directive is rather like a flag that tells other styling rules downstream in the styling hierarchy that could overrule that style setting, not to. It’s not bomb proof though as there are situations where it won’t help and in general it’s use should be limited. In this case, I think you will be fine :slight_smile:

Best wishes!

1 Like
7

Please write how to properly write the path to my custom CSS file in Resources?