[Support request] Sections order

Home Forums Support Sections order

Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #1093791
    Daniel

    Hello, could you help me please with section problem? I set the order of sections 1 to 6, but after loading on the mobile phone is the first place section 3. How to have the same order as on the desktop, please?

    #1093810
    Daniel

    🙁 I have one more problem. I addded screenshot.

    Thx!

    #1093902
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    Try this CSS:

    @media (max-width: 768px) {
        .site-main {
            display: block;
        }
    }

    Did you figure out the second issue? It looks good to me.

    Let me know 🙂

    #1094427
    Daniel

    Please, open webpage on mobile phone. I see this problem on Iphone 6. Thx

    Where change it this code, please?

    @media (max-width: 768px) {
        .site-main {
            display: block;
        }
    }
    #1094445
    David
    Staff
    Customer Support

    Hi there,

    add the code to Customizer > Additional CSS.

    Whilst in there also look for this CSS:

    .inside-page-hero {			
    	margin-left: 40px;
    	margin-right: 50%;
    }

    and change it to:

    .inside-page-hero {			
    	padding-left: 40px;
    	margin-right: 50%;
    }
    #1094470
    Daniel

    Hi, section order is okey now. Tjx!

    Second solution did not work. I did not find a class “.inside-page-hero”, when I added to Customizer > Additional CSS, I see no change. I added screenshot from mobile phone.

    Thank you so much

    #1095005
    David
    Staff
    Customer Support

    Can you remove this CSS:

    /* ------
    Page Header
    ------- */
    
    .page-hero {
      height: 100vh;
      background-size: 70vh;
      background-position: 90%;
    }
    .inside-page-hero {			
    	margin-left: 40px;
    	margin-right: 50%;
    }
    
    @media (max-width: 419px ){
      .page-hero {
    		min-height: 568px;
    		background-position: 42vw !important;
    	}
      .inside-page-hero {
        margin-left: 20px !important;
    		margin-right: 20% !important;
      }
    }
    @media (min-width: 420px) and (max-width: 768px) {
      .page-hero {
        background-position: 60vw !important;	
        background-size: 60vh !important;
      }
      .inside-page-hero {
        margin-right: 40% !important;
      }
    }

    and the last line:

    .inside-page-hero {			
    	padding-left: 10px;
    }

    Once thats done – let me know and ill provide some new CSS.

    #1095118
    Daniel

    Hi, mobile version looks good, but desktop version is broken now.

    #1095119
    Daniel

    Right desktop.

    Thx for a help! 🙂

    #1095128
    David
    Staff
    Customer Support

    Now add this CSS:

    @media (min-width: 769px) {
        .page-hero {
            background-size: contain !important;
            background-position: right center !important;
        }
    }

    In the Header Element you can add some padding so the text doesn’t touch the edges.

    #1095194
    Daniel

    Thanks, look good. 🙂 Last problem is with Heading 1, Heading 2. I need padding-left: 40px;. The old class generates problem.

    .inside-page-hero {			
    	padding-left: 10px;
    }
    #1095562
    Daniel

    Do you have a solution, please?

    #1095626
    David
    Staff
    Customer Support

    Instead of using CSS – edit the Header Element there is an option to add padding.

Viewing 13 posts - 1 through 13 (of 13 total)
  • You must be logged in to reply to this topic.