1. PROMO Upgrade to Pro Membership @ $99 / Lifetime & access all our 16+ premium Divi extensions: Divi Block, Carousel Toolkit, etc.LEARN MORE
Dismiss Notice
NEW Divi.Help Pro Carousel AI Toolkit - Magically turn your Divi design into carousel, simply by using our online toolkit. No plugins needed. Now it works with Divi 5 as well!Try our carousel AI toolkit
BEST Divi Block - A revolutionary drag & drop tool to easily mix & match 960+ premade blocks (Light & Dark) to kick start your Divi site design. Special module designs are included as well. Also newly added AI generator & color. Now it works with Divi 5 as well!
Learn More About Divi BlockFree Version ~ 340+ Free Blocks

Divi columns vertical align content: problems with mobile and tablet view

Discussion in 'Free Divi Community Forum' started by kotkota, Aug 9, 2019.

  1. kotkota

    kotkota Member

    Need to make content the same height size like image.
    Using this code in Custom CSS of for each column:

    Code:
    Log In or Sign Up to view this code.
    On desktop it looks good, but have some problem on mobile view and a lot of problem on tablet view (special on iPad Pro view).
    Can you help me resolve this problem and make the same height on all devices?

    Desktop - Desktop.png
    Mobile - mobile.png
    iPad - ipad pro.png
     
    1. PRO MEMBER PERKS Divi.Help Pro Layout Packs - Agency Divi layout pack featuring unique comment design on single blog post page:View Demo
  2. Divi.Help

    Divi.Help Administrator
    Staff Member

    For the image, just make it a column background image. Then it will always have the same size as the other column.
     
  3. kotkota

    kotkota Member

    If images made by background they are disappear on mobile and tablet.
     

    Attached Files:

    1. PRO MEMBER PERKS Divi Block Pro - Premade mega menu design for your Divi site without using any plugins:View Demo
  4. Divi.Help

    Divi.Help Administrator
    Staff Member

    For this issue, try to set padding top for the column settings. Then the background image will show up on mobile and tablet.
     
  5. kotkota

    kotkota Member

    Have made top-padding. No results. It is still invisible on mobile and tablet.
     
    1. PRO MEMBER PERKS Divi.Help Pro Layout Packs - Agency Divi layout pack featuring modern overlay archive blog layout with hover effects:View Demo
  6. Divi.Help

    Divi.Help Administrator
    Staff Member

    It should work. Do note that it's the top padding for the column settings, not row settings. If still not working, kindly share your URL.
     
  7. kotkota

    kotkota Member

    Have add top-padding for column settings. If columns haven't any content backgroind is not visible is not visible on mobile.
    please check here (pass: Master1). All rows with images. Last row Test 1 and Test 2 with image backgrounds. One with lorem ipsum text (it is visible)
     
    1. PRO MEMBER PERKS Divi Block Pro - Premade horizontal timeline design for your Divi site without using any plugins:View Demo
  8. Divi.Help

    Divi.Help Administrator
    Staff Member

    I see it's because Divi automatically hide those column without modules.

    You can try to add an empty code module in the column & see if it works.

    Alternatively, you can try to add the below CSS in Divi > Theme Options > Custom CSS:
    Code:
    Log In or Sign Up to view this code.
     
    kotkota likes this.
  9. kotkota

    kotkota Member

    It works with this CSS code and with padding top. Thanks!
    Want to ask about columns order on mobile.
    It is possible to make it like: Image - Text - Image - Text- Image - Text.... Now on mobile it looks like: Image-Text-Image-Text-Text-Image... ?
     
    1. PRO MEMBER PERKS Beautifully crafted custom colored 'Digital Marketing' Divi layout for all Pro members:View Demo
  10. Divi.Help

    Divi.Help Administrator
    Staff Member

    kotkota likes this.