Title: Invalid CSS
Last modified: August 20, 2016

---

# Invalid CSS

 *  [Pink Garden](https://wordpress.org/support/users/pinkgarden/)
 * (@pinkgarden)
 * [13 years, 5 months ago](https://wordpress.org/support/topic/invalid-css-1/)
 * Hi
 * Love this plugin but the following code invalidates CSS:
 * .cboxIE #cboxTopLeft, .cboxIE #cboxTopCenter, .cboxIE #cboxTopRight, .cboxIE #
   cboxBottomLeft, .cboxIE #cboxBottomCenter, .cboxIE #cboxBottomRight, .cboxIE #
   cboxMiddleLeft, .cboxIE #cboxMiddleRight
 * Please could you either remove or fix this?
 * Thanks
    Gem
 * [http://wordpress.org/extend/plugins/jquery-colorbox/](http://wordpress.org/extend/plugins/jquery-colorbox/)

Viewing 3 replies - 1 through 3 (of 3 total)

 *  [tzdk](https://wordpress.org/support/users/tzdk/)
 * (@tzdk)
 * [13 years, 4 months ago](https://wordpress.org/support/topic/invalid-css-1/#post-3286051)
 * Not an error but result of validator not approving of special IE code.
 * Also check “behavior” vs. “_behavior”. Both for more special old IE code but 
   last one apparently a hack to avoid issues with other browsers [http://breakthroughdesign.com/transparent-images-ie-using-pngs/76](http://breakthroughdesign.com/transparent-images-ie-using-pngs/76)
 * This is the chunk in colorbox.css you refer to I think
 *     ```
       /*
         The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
         when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9.
         See: http://jacklmoore.com/notes/ie-transparency-problems/
       */
       .cboxIE #cboxTopLeft,
       .cboxIE #cboxTopCenter,
       .cboxIE #cboxTopRight,
       .cboxIE #cboxBottomLeft,
       .cboxIE #cboxBottomCenter,
       .cboxIE #cboxBottomRight,
       .cboxIE #cboxMiddleLeft,
       .cboxIE #cboxMiddleRight {
           filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
       }
   
       /*
         The following provides PNG transparency support for IE6
         Feel free to remove this and the /ie6/ directory if you have dropped IE6 support.
       */
       ```
   
 * I only know CSSLint [http://csslint.net/](http://csslint.net/) that take CSS 
   validation seriously and still much output is debatable. No IDs policy is bad
   fit for many things, including common sense. But why you can enable/disable all
   tests via drop down arrow. Very good overall. What you use?
 *  Thread Starter [Pink Garden](https://wordpress.org/support/users/pinkgarden/)
 * (@pinkgarden)
 * [13 years, 4 months ago](https://wordpress.org/support/topic/invalid-css-1/#post-3286053)
 * Hi tzdk
 * I didn’t mention anything about an error, I specified that it invalidates CSS
   markup.
 * I’m fully aware that valid CSS & HTML is widely debated but most good web designers
   DO validate their code and consider it a serious and professional practice and
   I prefer to have that option.
 * [http://www.hobo-web.co.uk/official-google-prefers-valid-html-css/](http://www.hobo-web.co.uk/official-google-prefers-valid-html-css/)
 * Perhaps you could offer users the option to use the default stylesheet that comes
   with the plugin or to use their own CSS. That way, the code from the plugins 
   stylesheet can be copied to the main site stylesheet minus the invalid CSS code.
   Everyone’s happy!
 * Widely used markup validators from the World Wide Web Consortium:
 * CSS Validator: [http://jigsaw.w3.org/css-validator/](http://jigsaw.w3.org/css-validator/)
   
   HTML Validator: [http://validator.w3.org/](http://validator.w3.org/)
 *  [tzdk](https://wordpress.org/support/users/tzdk/)
 * (@tzdk)
 * [13 years, 4 months ago](https://wordpress.org/support/topic/invalid-css-1/#post-3286054)
 * I am not developer but CSS comes from Colorbox not this WP plugin. [http://www.jacklmoore.com/colorbox](http://www.jacklmoore.com/colorbox)
 * Well as said I would use CSS-Lint for CSS. Or try check/validate HTML5 BoilerPlate,
   Twitter Bootstrap or similar “authority” things and you will probably get in 
   to a spin of who to guide you. Those validator services are not supreme court,
   or necessarily updated! = not relevant with everything. CSS Lint is updated, 
   over and over. Not even sure about how updated as I think they still insist on
   IE10 prefixes which have been deprecated since last summer! And IE9 dont even
   know them so what is the point? Site is ultra conservative I think. ColorZilla
   also still use them. Dont believe all you see on internet. “Lots of stuff need
   updating” [http://www.impressivewebs.com/dropping-ms-vendor-prefixes-ie10/](http://www.impressivewebs.com/dropping-ms-vendor-prefixes-ie10/)
   sure, in 1 year or so…. Until then you can say “invalid” all day long 🙂
 * Apparently CSS Lint call red alert for the old IE6 hack I mentioned, _behavior,
   but if used like that to avoid issues with normal browsers it make sense even
   if invalid. Using a body/hmtl class would be better and probably why they declare“
   parsing error” or stupid hack.
 * I actually dont use the plugin right now but have before and then I deregistered
   themes. Copied CSS to other file and removed stuff, like the IE6 chuncks. Nothing
   stops you from doing that. I am also pedantic with correctness – and hate fluff
   and more http requests than necessary. Speed is also a parameter.
 * Choose a theme, lets say no. 3. Then you have that + 1 CSS file the Zoom part
   to get rid of.
 *     ```
       add_action ('wp_enqueue_scripts', 'dropColorboxCSS');
       function dropColorboxCSS() {
       wp_deregister_style('colorbox-css'); // jquery-colorbox-zoom.css file
       wp_deregister_style('colorbox-theme3'); // colorbox.css in theme3 folder
       }
       ```
   
 * One thing to remember is the /images/ folder under each theme. 3, or at the very
   least 3, calls to those files will need to be changed in your own CSS file. Change
   to absolute path or relative to own CSS file/folder.
 * Also in other folder where jquery-colorbox-zoom.css is you see
 * `background: url("../images/zoom.png") no-repeat scroll 50% 50% transparent;`
 * So it will look for /images/ folder 1 level higher up. Wont match your own CSS
   so have to change path and/or placement of those images. Besides this it totally
   works and you can change/improve what you like.
 * This info you can get out of /jquery-colorbox/includes/jquery-colorbox-frontend.
   php file. I think he use some variable for theme number but if you want no. 5
   just change number in above snippet.

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Invalid CSS’ is closed to new replies.

 * ![](https://s.w.org/plugins/geopattern-icon/jquery-colorbox_848c98.svg)
 * [jQuery Colorbox](https://wordpress.org/plugins/jquery-colorbox/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/jquery-colorbox/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/jquery-colorbox/)
 * [Active Topics](https://wordpress.org/support/plugin/jquery-colorbox/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/jquery-colorbox/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/jquery-colorbox/reviews/)

## Tags

 * [css](https://wordpress.org/support/topic-tag/css/)
 * [invalid](https://wordpress.org/support/topic-tag/invalid/)

 * 3 replies
 * 2 participants
 * Last reply from: [tzdk](https://wordpress.org/support/users/tzdk/)
 * Last activity: [13 years, 4 months ago](https://wordpress.org/support/topic/invalid-css-1/#post-3286054)
 * Status: not resolved