WordPress is reformatting my CSS and munging it

  • Unknown's avatar

    I’m using the Custom CSS feature. I have my CSS working fine on a local install of WordPress on my dev machine. When I upload the CSS to WordPress.com – WordPress reformats my CSS (running it through some form of Tidy?) which screws up a lot of my definitions, particularly quotes around typefaces (which must be there) and such.

    Is there anyway around this nonsense?

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar

    The Stylesheet editor is arbitrarily stripping out CSS3 background gradients and other necessary declarations from my CSS. This is just dumb. I’m a big boy, please allow me to handle my own CSS – this is what I paid for right?

  • Unknown's avatar

    G’day,
    Are you aware that CSS editng is theme specific at wordpress.COM? And, have you read this? http://csswiz.wordpress.com/2009/10/15/if-you-have-the-wp-com-css-upgrade/

  • Unknown's avatar

    @timethief – this is not an issue, since I’m completely replacing the CSS (ticked the nice little box that says use my custom CSS only.)

    The CSS Editor runs my CSS through a parser which arbitrarily strips out CSS3 selectors for background-gradient. It also munges quotes around typefaces and gets horribly confused on :before and :after pseudo-selectors.

  • Unknown's avatar

    It’s my understanding that the only themes we can use are found here > Appearance> Themes and that if you wish to “build” then you must do so by using the Sandbox 1.6.1 theme.

    Sandbox 1.6.1
    Rich with powerful and dynamic semantic class selectors, Sandbox is a canvas for CSS artists
    Tags: white, microformats, fixed-width, flexible-width, one-column, two-columns, three-columns, four-columns, left-sidebar, right-sidebar

    There is no Staff support for the CSS upgrade and there are precious Volunteers who do help with it. So you will have to patiently wait until one logs in, locates this thread and helps you.

  • Unknown's avatar

    I am using the Sandbox theme. This has nothing to do with the theme, it has to with the CSS parse that WordPress.com runs your CSS through after you hit save. It’s seriouslyt flawed and screwing about with my CSS.

  • Unknown's avatar

    @e2eentertainment, wordpress may not completely support all of CSS3 right now. That would be my guess as to why it is stripping out some of your declarations.

    As far as the stripping of the quote marks and such, I would suggest contacting staff directly at http://en.support.wordpress.com/contact/ . I’ve never had the CSS editor here strip the quote marks from around typefaces.

  • Unknown's avatar

    @TSP
    Thanks so much for picking this up.

  • Unknown's avatar
  • Unknown's avatar

    It will strip out all CSS that is not WP.com compatible, and only staff knows exactly what that is. The differences are significant. Rather than develop on an offsite WP.org install, you’ll have to develop CSS specifically for here. It’s been this way ever since the CSS upgrade began.

  • Unknown's avatar

    “It will strip out all CSS that is not WP.com compatible, and only staff knows exactly what that is. The differences are significant. Rather than develop on an offsite WP.org install, you’ll have to develop CSS specifically for here. It’s been this way ever since the CSS upgrade began”.

    That’s just sad. :(

  • Unknown's avatar

    Continuing to post here is not likely to be productive. I would suggest contacting staff directly at http://en.support.wordpress.com/contact/ .

  • Unknown's avatar

    @spotless, there are many reasons that certain CSS might be stripped out. Perhaps it is depreciated and not compliant with the level of XHTML and CSS that wordpress blogs are set up for. It will also strip out any CSS that might cause problems here.

    You have to remember that CSS is also theme specific. That means that in one CSS the main content may be in #container while in another theme it may be in #page, while in another it might be in #primary. Each theme author decides what they are going to name their selectors.

    The CSS for a particular theme that is used here is different from the same theme you can download off the internet because there are features and things here that aren’t built into the self-hosted version of wordpress, and also there are features that might be in the outside theme that are not supported here at wordpress.COM.

    You simply cannot work on a local .ORG installation of a theme on your computer and then transfer the CSS over to .COM and expect it to work. The .COM and .ORG themes are different.

  • Unknown's avatar

    This is weird. I haven’t noticed this problem yet, but I certainly would not expect the CSS to be trashed like this.

    @thesacredpath and @timethief – you seem to have misunderstood the problem being reported here. This is not a theme specific issue at all, it’s just a matter of a bug in the CSS parser.

    @e2eentertainment – The plugin used here on WordPress.com is called Safe CSS and is available in the WordPress.org plugin repository. If you know some PHP, perhaps download it and figure out where the bug is. If you can provide them with a patch they’ll probably fix it pretty quick. I had a similar problem a few months ago and they fixed the bug within a day or two for me. As long as your provide the solution there’s no reason they couldn’t fix it for you just as quickly.

    Here’s the URL for the plugin in the repo.
    http://wordpress.org/extend/plugins/safecss/

  • Unknown's avatar

    @e2eentertainment – I have no idea what technical knowledge you have on this sort of thing so I’ll just plow ahead with some advice here ….

    I suspect the actual problem here is that they’ve made use of something called CSS Tidy. I was writing a plugin which needed to use a CSS parser a while back and ended up trying CSS Tidy for that too, but it doesn’t handle a lot of things which it should do. I can’t remember the exact problems, but it certainly wasn’t operating in the way I would expect it to. I ended up having to write my own parser to do the job.

    The CSS TIdy project didn’t seem to be actively worked on, which would explain why it does’t support some CSS3 techniques.

    The latest news on the CSS Tidy page on SourceForge is dated at “July 19, 2007”, so it’s not exactly cutting edge :p
    http://csstidy.sourceforge.net/

    I suspect it might be more sensible to strip out the CSS Tidy parser and write something from scratch. From what I saw of the code last time, it was hideously complex for something which is doing something relatively simple. I did have trouble trying to write something which could handle ALL of the possible variants of CSS that I might want, so ended up cheating and created a parser which couldn’t handle some types of CSS (which was fine for my own purposes) otherwise I’d pass on the parser I wrote to be used instead.

  • Unknown's avatar

    I tried using :before and :after pseudo classes within the CSS on this site:
    http://icicle.co.nz/

    However I can’t see any problems. The CSS was parsed as expected.

    #test li:after {
    background:red;
    }

    #test li:before {
    background:orange;
    }
    You can see the result at the bottom of the CSS file … http://icicle.co.nz/?custom-css=1&csblog=ZxnI&cscache=5&csrev=19

  • The topic ‘WordPress is reformatting my CSS and munging it’ is closed to new replies.