Jetpack Mobile Theme - Background Image CSS mystery (1 post)

  1. CarltonBale
    Posted 2 years ago #

    No matter what I've tried, I can't get the background image attachment position to be FIXED in the Jetpack Minileven mobile theme.

    As I understand it, I should be able to specify these values using the add_theme_support( 'custom-background' ); function in the function.php file of my full-site theme, and it will pass this as inline CSS to both the full and mobile themes. The inline CSS does pass as expected in the full-site theme, but only some of the inline CSS values are passed on to the mobile theme.

    Full Site Inline CSS (from Firebug)

    body.custom-background {
        background-attachment: fixed;

    Mobile Site Inline CSS (from Firebug)

    body {
        background-attachment: scroll;
    ...other body CSS is the same as full site...

    I have no idea where the "scroll" is coming from; all of the other body CSS is the same as the full site.

    Next I tried to fix this using Jetpack Custom CSS, but this didn't work either. Here's the Custom CSS I specified:

    .mobile-theme body {
    background-attachment: fixed important!;

    and also

    body {
    	background-attachment: fixed important!;

    The reason this doesn't work is because the body tags in the custom CSS <strong>are automatically removed from the output</strong>. Firebug shows this for the resulting custom-css:

    .mobile-theme body {
    body {

    I don't want to make changes to the Jetpack Mobile Minileven theme files because those will get lost during upgrades. Any ideas how to get a fixed (non-scrolling) background image in the mobile theme? What's creating that background-attachment: scroll CSS in the mobile theme?

    Here's the site, for reference:
    Full site: http://carltonbale.com/?ak_action=reject_mobile
    Mobile site: http://carltonbale.com/?ak_action=accept_mobile


Topic Closed

This topic has been closed to new replies.

About this Topic