Question 2082 in Wordpress Question posted in
The official Wordpress documentation can be found here.

How do i fix the sticky footer? – WordPress

I have implemented a sticky footer on my wordpress website with this HTML code:

<style>
.footer{
   position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;}
</style>

But when viewing the post, the footer goes beyond a section on the website (attaching the image below) and screws up the carousal too. Ho do i fix this?
footer going beyond the carousal section

I was trying to implement a sticky footer on my website. I was expecting it to get fixed at the bottom of the screen and not change anything else.

Tags:

2

Answers


  1. 0

    Try to apply z-index property.

    z-index property specifies the stack order of an element.

    An element with greater stack order is always in front of an element with a lower stack order.

    Login or Signup to reply.
  2. 0

    Make sure to give a z-index property to your .footer styles. An element with a larger z-index is always stacked on top of an element with a lower z-index. Elements with the same z-index are stacked in the order they appear in the document. By default, elements have a z-index of 0. However if your footer will always be visible, better go with 100 and sure it will come on top.

    Also on the picture it looks like it doesn’t take the 100% width. Maybe you have margin or padding set on the parent element. But also can try to use 100vw which is gonna be the view width of the screen.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search