This one has bothered me since day one using C5. I'm about as seasoned as you can get with CSS, yet no modification I've made to the source files fixes this. Everything logical fails.

I know it's only cosmetic, but it's a drag to explain to clients that I can't do anything to make the buttons whole.

The only explanation I can assume, is that C5 is allowing something in custom-theme CSS to override its own CSS, thus breaking those buttons' appearance.

C5: any thoughts on this?

What browser you guys on? I've never seen this.

I test sites in 22 browsers on 4 platforms. It's the same in every one.

okay thats just odd.. so if this isn't something we can blame on microsoft, i guess we need to look at the themes... are you saying you've built a custom theme that does this, or one of the custom themes you're downloading from our marketplace does this..

can we see that code, or a URL to the site?

My theme is completely custom. I've only used C5 on one live site so far. The others are in development and I can't yet share them. The URL for the live site is here:

http://www.walkermacy.com/

(I didn't design this site, by the way. We just recoded an existing website from scratch for SEO/CMS purposes.)

Obviously something in the theme's CSS is overriding the system's CSS. I don't know how that would happen, but it appears to be so. If I swap out the theme on this site (in a local development server) with one of your default themes, the buttons are fine. Thus my conclusion that C5 is allowing the theme's CSS to override the system's CSS.

c5 can't "allow" css to do one thing or another.. we can continue to try to force strict classes on things but i think it's always going to be possible to tweak your css in a theme and have an impact on the editing experience...

that being said, i'm sure there's something simple in your css that could be renamed to cause buttons to not look this way, maybe someone can dig it up..

I was just wondering if you had set some of the pixel widths to a new setting. I haven't tried setting a template to smaller than the original designed templates only bigger.

I know that is a simple thing, but it could be what has happened.

-Bill

Your custom css files are loaded after the c5 css file. c5 cannot help if you overwrite css rules.

But in your theme, you could try to put
<?php Loader::element('header_required'); ?>
after your css files links (probably in themes/walker-macy/elements/header.php).

I realized that my type selectors for the "a" tag are overriding the C5 CSS for those buttons. This makes sense and is something I blindly failed to consider because C5 runs its editor buttons and the site concurrently. I can convert those to ID selectors and the problem will subside. Though I'll first try to load the C5 header after the CSS calls so I don't have to change any CSS.

Thanks, all.

Switching the load of the header worked for me thanks! It seems having the global selector a:link with background:transparent was my culprit in case anyone else encounters this. Thanks for the quick response people, c5 and the community here are both pretty awesome.