Section height

Home Forums Support Section height

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #129940
    Marko

    Hello guys,

    I don’t seem to find anything related to setting the height of a section.

    I just want 4 sections that link to specific categories. For every section I have a background image. All of the images have the of 1500x500px. Above this image just a short text, a sentence or two. It just has to look good.

    But when I insert the background image it’s automatically very slim and just show a slim stripe of the image.

    Is there like a recommended background image size? Do I have to edit the CSS in order show the background image normally? Any tips?

    Here is a screenshot: https://drive.google.com/file/d/0B5Fus0stire6VFJUUnpCVFZTbk0/view

    #129942
    Jean

    Hello Marko,

    You can specify top padding and/or bottom padding for each section:

    The value is Pixels.

    #129949
    Marko

    Hey Jean,

    well it looks like this is the easiest option. It also affects the position of the text, but then I have to change the bottom padding or add a nbsp in the text. For now I can live with this solution.

    One more question while we are talking about section: Can I set the whole background image as a link?

    Thanks a lot, Marko

    #129970
    Jean

    You plan to use for all sections a diferent link, or want in only one section? Maybe I can come up with something based on your needs.

    #129974
    Marko

    Yes, every section should link to a different category. 4 sections should link to 4 different categories. That would be the best option probably.

    Let me know if you have something.

    Thanks a lot, Marko

    #130034
    Tom
    Lead Developer
    Lead Developer

    Hi Marko,

    Definitely tough to achieve..

    One option, maybe..

    1. Add an image to your section with a link around it:

    <a href="http://generatepress.com"><img src="URL TO FULL BACKGROUND IMAGE" alt="" class="full-section-bg"></a>

    Then add this CSS:

    .full-section-bg {
        height: 100vh;
        left: 0;
        object-fit: cover;
        position: absolute;
        top: 0;
        width: 100vw;
    }

    Just a theory – but it may work.

    Let me know 🙂

    #387118
    joecocker

    Hey Tom, warming up this topic a bit because my question is related to section height as well:

    I have some sections with an inclusion of dynamic content with differing height, so I need a dynamic height for this content – otherwise the content is hidden. So, is it possible to have a dynamic section height, perfectly growing with its external content

    ? You can see this here: http://www.haus-jasmin-buesum.de/apartments/

    Would be nice to have and thanx a lot in advance
    Juergen

    #387201
    Tom
    Lead Developer
    Lead Developer

    Element heights will adjust to their content by default – the more content/padding, the taller the element will be.

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