Tagged: ,

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • July 15, 2022 at 4:20 pm #1358510
    TippingPointSolutions

    Hello, again!

    We are attempting to finalize our site (https://conectadolaunch.wpcomstaging.com/landing/)and make it mobile friendly, but when we hide an element using the ‘Responsive’ tab or by using the CSS provided on this same topic the hidden element creates whitespace.

    Is the best practice to clone an element, redesign it for mobile, and then hide the original on mobile (and the clone on desktop)?

    We have added the following CSS code:
    `/* Only display element on mobile */
    @media only screen and (max-width: 768px) {
    .only_desktop {
    display: none !important; }
    }

    /* Only display element on mobile */
    @media only screen and (min-width: 769px) {
    .only_mobile {
    display: none !important; }
    }

    July 15, 2022 at 5:02 pm #1358523
    Rikard

    Hey TippingPointSolutions,

    It looks like the element that you are trying to hide is located in a Color Section? If that is the case, then please try to hide the whole section instead of the element located inside of it. You have preset option to hide Color Section element for certain screen widths in the element options.

    Best regards,
    Rikard

    July 15, 2022 at 5:17 pm #1358525
    TippingPointSolutions

    Thanks for the response!

    It is actually just a Text Block with the “only_mobile” class, but after entering it into the Color Section that appears to have fixed the issue. Thank you!

    July 15, 2022 at 8:01 pm #1358540
    Rikard

    Hi,

    Great, I’m glad that you got it working. Please let us know if you should need any further help on the topic, or if we can close it.

    Best regards,
    Rikard

    July 18, 2022 at 5:52 pm #1358673
    TippingPointSolutions

    Real quick, I am getting a block of white space above our contact form (below the last video). Would you be able to assist with that? It looks like our desktop elements are hidden and I don’t see any extra padding…

    July 18, 2022 at 10:09 pm #1358703
    Rikard

    Hi,

    Thanks for the update. It looks like there is padding applied to both the column with the let’s go text, and the actual form. Could you double check your settings there please? If you need further help, then please post admin WordPress login details in private.

    Best regards,
    Rikard

    July 25, 2022 at 8:07 pm #1359407
    TippingPointSolutions

    Hello!

    Sorry for the slow response. It has been a crazy week here.

    I checked the padding settings for the Color Section that the Text Block resides in. It has the ‘no padding’ option selected. I don’t see the padding options available in the form settings. I tried adding my own CSS under ‘General Styling’, but couldn’t get it to apply to it.

    July 25, 2022 at 8:50 pm #1359415
    Rikard

    Hi,

    Thanks for the update.

    If you need further help, then please post admin WordPress login details in private.

    Best regards,
    Rikard

    July 25, 2022 at 9:15 pm #1359416
    TippingPointSolutions

    Attached the login info.

    Thanks!

    July 26, 2022 at 1:26 am #1359425
    Mike

    Hi,
    Thank you for the link to your site, the only padding or space that I see above your contact form is from the color section content class:

    .content {
    padding-top: 50px;
    padding-bottom: 50px;

    This is from the color section for every element added, please try adjusting this for this one element if you need further help please let us know.

    Best regards,
    Mike

    July 26, 2022 at 3:14 pm #1359473
    TippingPointSolutions

    Okay, excellent. Thank you very much! You may close the ticket.

    July 26, 2022 at 5:37 pm #1359482
    Mike

    Hi,
    Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

    Best regards,
    Mike

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘Hidden Element Creating Whitespace’ is closed to new replies.