#79409 .elementor-section.elementor-section-height-full

Landing Forums JupiterX WordPress Theme .elementor-section.elementor-section-height-full

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • vero.laban-598c5e41

    Hello,
    could you help me with .elementor-section.elementor-section-height-full ?
    On my home page, the first section is in height-full. But when the screens are too small in height, the display is not pretty.
    I added a css to solve this problem but it doesn’t work:

    @media (max-height: 800px)and(min-width:768px){
    .elementor-section.elementor-section-height-full {
    height: auto!important;
    }}

    Do you have any idea how to solve my problem?
    Thank you in advance!

    Nodari Support Team

    Hey there

    You may try something like this instead:

    @media (max-height: 800px)and(min-width:768px){
    .elementor-section.elementor-section-height-full {
    height: 100vh !important;
    }}

    when you set height: 100vh; it means the height of this element will be 100% of the viewport height.

    vero.laban-598c5e41

    Hello,
    Thank you for your answer, but I have the impression that we didn’t understand each other.
    What I want is :
    – when the height of the screen is greater than 800 pixels, my first section should be 100% high (this is already happening on my site)
    – when the screen height is below 800px, the first section of the page is no longer 100% but its height is defined by its content.
    Thank you in advance.

     

    Tatyana Hutsol Support Team

    Hello,

     

    Sorry for a delay.

    Do you want to have full height on mobile view too or set it to auto due to the content height?

    Please provide WP Dashboard URL to check the backend.

     

    Thank you.

    Regards.

    vero.laban-598c5e41

    Hello, thank you for your answer.
    No, I don’t want full height in mobile.
    My problem is on 13″ laptops (see screenshot).
    Thank you in advance.

     

    https://nouveau.comite-richelieu.org/wp-admin

    Tatyana Hutsol Support Team

    Hello,

     

    Please remove your previous code and add the new one:

    @media (max-width: 1024px)and(min-width:768px){
    .elementor-section.elementor-section-height-full {
    height: auto!important;
    }}

     

    Let us know the result.

    Regards.

    vero.laban-598c5e41

    Thank you for your response but it does not work…
    However, I believe I was not clear. My goal is that the section is not in full height when the screen HEIGHT is small on a computer.
    I put a screenshot in my first message to show you the problem: the content of the section comes under the logo.
    Thanks in advance!

    Nodari Support Team

    Hello Vero

    So, shortly, your problem is this: “when the screen height is below 800px, the first section of the page is no longer 100% but its height is defined by its content.” Yes, I understand you, but yet in Elementor there is no such option to change the appearance of the elements based on viewport height, there is an option to change them by the width of the screen (https://prnt.sc/ubvrj0) but no option to change them by the height, this means if this problem is critical for you you have to customize it by the custom CSS, its possible to change element style by the height of the viewport, by using this method: https://developer.mozilla.org/en-US/docs/Web/CSS/@media/height but in this case you need to manually adjust the style of your elements in this section, The responsiveness of your section is good though.

    I would also recommend to reach out Elementor support about this, probably you are not the first one with this problem and they may have some solution for you πŸ™‚

    I hope it’s clear now πŸ™‚

    vero.laban-598c5e41

    Yes its very clear!

    Thank you!

    Nodari Support Team

    Nice to hear Vero

    If you need any help from our side we are always here πŸ™‚

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