CSS Incorrect when css_fast_load=true

• Type: Bug
• Status: Closed
• Priority: Minor
• Resolution: Inactive
• Affects Version/s: 6.1.1 CE GA2
• Fix Version/s: None
• Component/s: Frontend Infrastructure, Themes Infrastructure
• Labels:
  • community-verifier
• Environment: Reproducable in multiple environments including standard tomcat bundle and WAR deployment under existing Tomcat installation.

Deploying custom theme in development environment works correctly. In production environment with theme.css.fast.load=true (by default), the CSS attributes are being calculated differently. Adding "?css_fast_load=0" to the URL in production resolves the issue temporarily.

The new theme is based on the "classic" theme and rather than copy and modify the entire "custom.css", we have modified "main.css" to include "theme.css" as the last import. This technique works fine and makes version control and upgrade much easier given the minimal changes we are making to the classic theme.

theme.css

@import url(color_schemes/manl.css);

#wrapper {
    background-image: url(../images/custom/wrapper_bg.png);
    background-repeat: no-repeat;
}

#sign-in {
	top: 0;
}

#banner {
    background-image: url(../images/custom/banner_bg.png);
    background-repeat: no-repeat;
    background-position: 90% top;
}

#heading {
    height: 131px;
}

The panels below show Firebug's capture of the CSS delivered in each of the two scenarios.

main.css with ?css_fast_load=1

#wrapper {
    background: none repeat scroll 0 center transparent;
    margin: 0 auto;
    max-width: 90%;
    min-width: 960px;
    position: relative;

main.css with ?css_fast_load=0

#wrapper {
    background: none repeat scroll 0 0 transparent;
    margin: 0 auto;
    max-width: 90%;
    min-width: 960px;
    position: relative;

Note the different interpretation for the "background" tag!!! It is the "center" vertical alignment that is causing our production issue.