Sign in

Simple: Post title overlaps header

  • This topic has 12 replies, 3 voices, and was last updated 9 months, 2 weeks ago by .
Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #3698
    Sebastian Stautz

    Depending on the value for the hero section height (40+ is uggly) my post titles are overlapping with the site header.

    Simple: 2.2.2.3

    Publii: 0.36.1

    #3699
    Sebastian Stautz

    Here an image.

    Attachments:
    #3701
    Sebastian Stautz

    I’m trying to keep my hero section small. I don’t have much there.

    #4674
    Sebastian Stautz

    I’m having with issue still with Publi 0.37.3 and Simple 2.3.0.0

    Can somebody help me here?

    #4680
    Tomasz Dziuda

    Hi,

    Could you provide an URL to your website?

    --
    Do you appreciate the support you've received today? If so, consider donating to the Publii team by clicking here; we'll be sure to use your donation to make Publii even better!

    #4684
    Sebastian Stautz

    Sure: https://enteresc.net/plug-and-play-replacement-ideas-for-testing/

    You can reproduce it easily with the mobile emulation.

    Currently the height of the hero section is 40vh to look at least at desktop acceptable. As lower the value as worse it gets.

    Attachments:
    #4686
    Tomasz Dziuda

    That’s weird – for me on around 360px wide screen it looks ok

    Screenshot-2020-12-02-at-23.40.30

    --
    Do you appreciate the support you've received today? If so, consider donating to the Publii team by clicking here; we'll be sure to use your donation to make Publii even better!

    #4689
    Tomasz Dziuda

    And here screenshot from my iPhone 11:

    IMG_F5A9CD9639D8-1

    --
    Do you appreciate the support you've received today? If so, consider donating to the Publii team by clicking here; we'll be sure to use your donation to make Publii even better!

    #4692
    Sebastian Stautz

    I can reproduce it with:

    • Windows laptop with Vivaldi, Chrome and Edge
    • Android with Opera Mobile and Chrome
    • iPhone SE with Safari (even in landscape mode)
    #4719
    Tomasz Dziuda

    I have found a reason of your issue – screen height 🙂

    Please try to add in Tools -> Custom CSS code like below:

     

    .hero {
    position: static;
    }

    .hero__content {
    margin-top: 150px;
    position: static;
    transform: none;
    }

    --
    Do you appreciate the support you've received today? If so, consider donating to the Publii team by clicking here; we'll be sure to use your donation to make Publii even better!

    #4722
    Sebastian Stautz

    Thanks. It works with the side header, but now article header is broken. Table of content and author are overlapping.

    I have uploaded the changes.

    Attachments:
    #4735
    Bob

    Hi Sebastian,

    Try this one:

    .hero {
    height: auto;
    }
    .hero__content {
    bottom: inherit;
    left: inherit;
    padding: 10rem 0 8rem;
    position: relative;
    transform: none;
    }

    Also, play around with the padding values to achieve a satisfactory effect.

    --
    Do you appreciate the support you've received today? If so, consider donating to the Publii team by clicking here; we'll be sure to use your donation to make Publii even better!

    #4742
    Sebastian Stautz

    Thanks! That fixes it.

Viewing 13 posts - 1 through 13 (of 13 total)
  • The topic ‘Simple: Post title overlaps header’ is closed to new replies.