Tagged: ,

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
  • #1236349


    on some automatically generated pages (bbpress pages) of my site there is not much content which leads to the socket moving up leaving an unpleasant gap on the bottom. (see link in private content)

    What CSS can I use to ensure that the socket is on the bottom in order to never have this gap between socket and bottom of browser window? Ideally, I want it to behave like on the homepage of my site (see link in private content). On the homepage I achieved this by setting the color section which includes all content to minimum 100% of browser height.

    Thank you for your help and best regards, peter


    Hey P3T3R_0ne,

    The page shared does not seem to have the issue on my end, do you have another page with the issue?

    Best regards,


    Hi Victoria,

    on my end there is a gap between socket and browser window. Probably for you not because you use a smaller screen? Anyway, in private content find a screenshot which shows the problem.


    another example would be this link (private content)



    Thank you for the info.

    We can use this css code set a minimum height to the main container which in turn will push the socket downwards and remove the space below.

    #main > .container_wrap.container_wrap_first.main_color.sidebar_right {
    	min-height: 520px;

    Best regards,



    this code is not satisfactory. It does push the socket down, but it gives irregular results depending on page content and screensize.

    Can we use the viewport vh unit instead of px? I tried setting 100vh on above css but it does not work.

    I would like to achieve the same effect as setting a color section to “at least 100% of browser window height”.


    Actually the css code you provided does not seem to apply on bbpress pages (link given in private content).


    I now went with the follwoing code:

    .entry-content-wrapper {
    min-height: 71vh;

    It sort of fixes the issue. But it’s not exact. If feasible, I would like an exact solution like setting an avia color section to min 100% of browser window.



    Thank you for the update.

    The css code that you added is almost the same css used to define the height of the color section, so you could keep it as is. We can apply the height dynamically based on the current height of the browser, but it will require a more complex solution which is beyond the scope of support.

    Best regards,


    Ok. I’ll keep it as is for now and might research the dynamic option. Thank you for the support.

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