Overlapping Style on Studio Registration Page

If you visit: http://www.microsoftesque.com/register/ you'll see that the Account Details and Profile Details overlap with the Create an Account "grey background box" style.

Fix?

  • Mason
    • DEV MAN’s Sidekick

    Hiya Dainis,

    Try adding something like this to the child's style.css:
    #register-page
    #register-page .standard-form {
    -moz-border-radius:0px 0px 0px 0px;
    background:none;
    border:none;
    }

    Probably best way of getting it done and keeping browser compatibility in check.

    Thanks!

  • dainis
    • The Incredible Code Injector

    huh, that did not work

    this does, but removes the nice background of the form:

    #register-page .standard-form {
    -moz-border-radius:0px 0px 0px 0px;
    background:none;
    border:none;
    }

    This does not work:

    #register-page
    -moz-border-radius:0px 0px 0px 0px;
    background:none;
    border:none;
    }

    I tried this:

    #register-page .standard-form {
    padding-bottom:25px;
    }

    and well, it extends the background to include Account Details and Profile Details, but that's not really right...looking to have Account Details and Profile Details below the standard form background and outline (which are nicely styled).

    Is there a way to do that?
    Best,
    Dainis

  • Mason
    • DEV MAN’s Sidekick

    Hiya,

    Try this:
    #basic-details-section { padding-top: 25px; }

    I would have suggested that the first time, but it's not as good for browser compatibility. Always best practice to test these changes in multiple browsers during development.

    Not saying the above will cause problems, just a word of caution.

    Thanks!

  • dainis
    • The Incredible Code Injector

    .register-selection { padding-top: 25px }
    does not work

    #basic-details-section .register-selection { padding-top: 25px }
    nope

    #register-selection { padding-top: 25px }
    nope

    #basic-details-section { padding-top: 25px }
    is the closest, but only fixes one side.

    am i missing something obvious here?

  • dainis
    • The Incredible Code Injector

    done thanks...how does this work when you guys upgrade the theme? what if you adjust that particular style in a way where it works for the new theme, but would not work with the setup of having that style changed in the child theme?

  • Mason
    • DEV MAN’s Sidekick

    Hiya,

    Well, it's always a possibility, though most of the time a theme update has more to do with the way a site functions, fixing an error or compatibility with newer version of WordPress/BuddyPress than just a padding difference.

    As with any plugin/theme upgrade, we recommend you test it thoroughly on a development platform before implementing it on a live site. There's always variables specific to your setup that you alone are equipped to watch for.

    Thanks!

  • dainis
    • The Incredible Code Injector

    ...the procedure then is:

    1) prior to upgrading, have a backup/dev environment that is parallel to the live install
    2) Upgrade in the dev environment
    3) Is there an automated way to see if there are any superfluous styles I may have added to the child theme? Oh, I could do this ...
    3.1) delete sections of the child themes customized CSS to see what I need to keep
    4) Poke around the site and troubleshoot
    5) When satisfied all is OK, move the dev version to live, and keep the dev version as the backup of the live one

    OK, so that relates to https://premium.wpmudev.org/forums/topic/best-backup-and-development-environment-solution

    ...how do you recommend I create the development platform?

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.