why does this class under taking so much empty space in responsive mode?

  • Resolved johannes999

    (@johannes999)


    1 year, 8 months ago

    Hello,

    when you go to my homepage and open inspect element and you go to repsonsive mode beween 200px and 320px you see before the header white space about 10 rem high .

    when I move my cursor on it I see under elements section on the right side

    this class name = .home page-template-default page page-id-7 no-sidebar

    I have tried to hide this class with minus margin but it didn’t work .

    how I can remove this empty place or this class it is above the header.

    what does this class mean exactly . I see it is giving home-page id but why it is taking this empty space . I dont see such a thing under resolution 1024px to 1600px?

    it is only present on responsive mode in media query!

    how I can solve this problem? or why this class taking so much space. I removed every widget and duisabled some jquery code but it didn’t help!

    thanks

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)

  • That’s from the following block of CSS in your theme’s style.css file:

    @media (min-width: 180px) and (max-width: 319.9999px) {
.slideshow {
    width: 100%;
    position: relative;
    display: flex;
    justify-content: center;
    margin-top: 8.25rem;
    background-size: cover;
} }
    Thread Starter johannes999

    (@johannes999)

    Thanks,

    I have corrected all the top containers with margin (- 8.25rem )

    and I used for (. slideshow) class and other pages image-headers with top margin (8.25rem) at this moment I see it works.

    but when I set for container margin-top 0 and for slideshow margin-top 0 the slideshow dissapears under the container . and when I use margin-top (plus) for slideshow or other header-images the container up comes down and the white space appears again on the top.

    I have did it expressly to let you see . you can go now to my url and open home page and other pages then you wil see the difference where I used margin ( – + 8.25rem ) for conatiner and header-images and where I set the margin for (0) for container and header-image.

    can you tell me why I have to use margin-top minus for the container . why is this white space on the top when I don’t use the minus .

    it has in reality to be margin-top= (0) and for slideshow or other header images margin-top = (0 )

    if you know the reason exactly can you tell me why . I wil appreciate it.

    thanks

    Thread Starter johannes999

    (@johannes999)

    I see that on media query 1024 – to 1600 I don’t have to use any margin-top. it is zero.

    I think this white space can be from the resolution may be from the underscore theme.

    thanks any way for your help.

    thank you very much

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘why does this class under taking so much empty space in responsive mode?’ is closed to new replies.