[Resolved] Space after page header

Home Forums Support [Resolved] Space after page header

Home Forums Support Space after page header

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1196990
    Regina

    Hithere,

    actually I already opened e ticket, but something went wrong. So I try it again:

    The page header of the front page has a height of 407 px, but should be only 400 px like the other pages. There is a space of 7 pixel after, which I do not understand. I have one header element for all pages and different hook elements with sliders. In the front page hook is a video inside:

    <div class="grid-container">
    <div class="video-logo">
        <img src="https://waescherei-dobrovsky.de/wp-content/uploads/2020/02/Logo-Dobrovsky-line.png" alt="Wäscherei Dobrovsky">
    	</div>	
    <video loop muted autoplay poster="https://waescherei-dobrovsky.de/wp-content/uploads/video/videoposter.jpg">
        <source src="https://waescherei-dobrovsky.de/wp-content/uploads/video/wasser.mp4" type="video/mp4">
    	</video>
    </div>

    .grid-container {
    position: relative;
    padding: 0;
    }
    .video-logo {
    position: absolute;
    padding: 20px;
    z-index: 1;
    }
    video[poster] {
    object-fit: cover;
    width: 100%;
    max-height: 400px;
    z-index: 0;
    }

    How can I close the space of this 7 pixels?

    Thank you in anticipation!

    #1197021
    David
    Staff
    Customer Support

    Hi there,

    include the vertical-align: bottom; property in this CSS:

    video[poster] {
        object-fit: cover;
        width: 100%;
        max-height: 400px;
        z-index: 0;
    
        /* Add the following property */
        vertical-align: bottom;
    }
    #1197036
    Regina

    Perfect!
    Thank you so much, David!

    #1197129
    David
    Staff
    Customer Support
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.