1. PROMO Subscribe our All Access Pass @ 75% OFF & access all our 16+ premium Divi extensions: Divi Block Pro, 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

Solved Full width header not resizing for mobile

Discussion in 'Basic Support Forum' started by sossyw, May 15, 2020.

  1. sossyw

    sossyw Member
    Divi Ultimate Child Theme

    Hi,
    I am using the Hero Header (Blurb), which contains a background photo.
    When I view it on mobile, it is making the photo huge and the text sentences are all stretched down the page, with one letter per line. Please see screenshot.
    Is there something I should be doing to have it automatically resize for mobile?
    Thank you.
     

    Attached Files:

    #1 sossyw, May 15, 2020
    1. PRO MEMBER PERKS Divi Block Pro - 30+ premade custom footer designs for you to choose from:View Demo
  2. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    That's weird. Kindly share your URL with such issue & I'll look into it.
     
    #2 Divi.Help Pro Support, May 15, 2020
  3. sossyw

    sossyw Member
    Divi Ultimate Child Theme

    #3 sossyw, May 15, 2020
    1. PRO MEMBER PERKS Divi.Help Pro Layout Packs - Agency Divi layout pack featuring modern overlay archive blog layout with hover effects:View Demo
  4. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    It's because for the CTA module settings, you set a margin right 649px. That's the culprit for your issue.

    To move it to be left, try the below instead:
    1. Go to the CTA module settings & set a smaller max-width, for example: 480px
    2. And set the margin right to be auto.
    3. And margin left to be 0.
     
    #4 Divi.Help Pro Support, May 15, 2020
  5. sossyw

    sossyw Member
    Divi Ultimate Child Theme

    Many thanks. That worked.

    Is there a way I can make the CTA text not go over the photo when viewing on mobile? Eg: for the CTA to sit under the photo as an example?
     
    #5 sossyw, May 15, 2020
    1. PRO MEMBER PERKS Divi.Help One-Page Layouts - Beautifully crafted one-page Divi layouts just for you:View All Layouts
  6. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    To move it downwards in mobile, you may try to set the some margin top for mobile:

    upload_2020-5-16_11-40-32.png

    Do note that this will make the section taller & thus pulling the image longer as well.

    If the background image still doesn't behave as you want it to be in mobile, then you will need to create another portrait version of your background image & switch it in mobile, so that it show up properly in the taller mobile section.
     
    #6 Divi.Help Pro Support, May 15, 2020
  7. sossyw

    sossyw Member
    Divi Ultimate Child Theme

    Thank you very much for your speedy assistance. Resizing the photo for mobile and setting the margin as indicated worked :) Thanks again.
     
    #7 sossyw, May 15, 2020
    Divi.Help Pro Support likes this.
    1. PRO MEMBER PERKS Divi Ultimate Header Plugin - Custom Divi Builder header on desktop + default slide in / fullscreen menu on mobile:Learn More
(You must log in or sign up to post here.)