Streaming live at 10am (PST)

Best way to add a footer?


#1

What's the best way to add a footer in Webflow?

I am curious to see how you guys do it. I just need a div element to stick at the bottom of the page, behind all of the other elements.

Please share the best way you have accomplished this.

Currently right now I just made a div with the margin pushed all the way to the bottom of the page. Is there a better way of doing this?

Sean


#2

Create a DIV (auto-sizes to 100% width)
Align Fixed Bottom
Set z-index to a high number

see video:

http://quick.as/RYwghGLy6


#3

Hey @Revolution,

What if I don't want it to scroll - would I just use the absolute -> align bottom and not set to fixed?

Sean


#4

so you want the footer to disappear off the page if the viewer scrolls up.

Just add a section or a div as the last element on the page.

You don't have to align the div to bottom if it's the last section (div).

And divs are automatically 100% width if displaytype is block.

If you use a section (in case you don't know: a wf section is not the same thing as an html5 section)...
you can add a container element (which is basically a smart div) in the section
so that all contained elements within the container are responsive to the device.

If you don't add a container to the section or just use a div instead of a section
the you will need to handle the responsiveness

If you were to do this in bootstrap or something else...
you would create a div (section) and place another div (container) inside it
that would sized and auto-margined to your liking.


#5

So if I want a footer to remain at the bottom of the page. No scrolling or anything but just sit at the bottom of the page. I would create a section with absolute positioning and set it to bottom?


#6

Hey @seank

Does this help?: http://nimb.ws/NBKmkF :smile:


#7

Thanks. If it's the last section it only makes sense that it will sit on the bottom of the page. Thank you.


#8

Your Welcome

Glad i could help :smile:


#9

#10