Sticky Footer with CSS | Push Footer at the Bottom of Page HTML & CSS 😍👍👌

[@maniac7591]

Thank you for being the only person to help me with this from the past 2 hours of looking this up. Appreciate it!

[@Pleasejustgivemeaname]

God bless you Indian men 🙏 I am proud to be part of your culture

[@smashtheshell]

Thank you so much 😍

[@StressedSloth]

Perfect , simple and works great with frameworks and previous css changes without broking anything

[@im_ostrovskiy]

THANKS MY FRIENDO YOU ARE THE BEST ARAB I HAVE SEEN

[@pankichal]

Thank you, if wasn't you, I'd still be solving this through hours in JS... 💖

[@nileshgore4790]

Thanks i resolved my issued because of you Nice video & Nice explanation .Thank you so much

[@janerdmann22]

thank you so much! i tried so many different methods and none of them seemed to work the way I wanted them to but yours instantly worked and it keeps the code really simple.

[@washingtonlgois]

OMG, thank you! You're a magician! Lol

[@DayTraderCut]

Thumbs up! You're a legend!

[@abdidesign3255]

Well done mate, Really good job, simple and straight forward

[@smashtheshell]

Thanks Man! 🙂

[@esshakhan7242]

Super easy to follow. Thanks alot!

[@smashtheshell]

I am glad it helped!

[@raktimjs]

This trick was fabulous, fantastic, great, awesome, and everything!!! Thak you!!

[@anudipiyumra7521]

This video was very helpful to me. Thanks a lot!

[@ashokkushwaha9939]

Thanks a lot, it disturbed me for a while but i was able to solve the issue bcz of you

[@smashtheshell]

I am glad that I could help you 😊

[@sanchez7866]

very good moves .. hatrick with 3 lines bro !!

[@smashtheshell]

Thanks bro 😊

[@chenardnoirpresidente5672]

First of all let me wish you a happy new year!
Great video my friend. I’ve applied it to my solution!

[@smashtheshell]

Same to you! I am really glad to hear that. It would be great if you could be the part of our community. 😊

[@DevHasan]

perfect soliution 💌.love from bangladesh.

[@JosephU]

Awesome! Simple and straight to the point.

[@solomonakinbiyi]

Finallyyyyyyyyyyyy, thanks so much, i've been looking for this solution

[@harmonicresonanceproject]

Nice! Worked perfectly for me.

[@lonleybeer]

Wow simple and straight forward, well done

[@davidouyang5626]

OMG. Thank you. You saved me a lot.

[@smashtheshell]

Great to hear!

[@ztipsamme]

Thank you, thank you, thank you!!! 🙏🏼 I've been searching for a solution for several hours 🥵

[@smashtheshell]

Glad I could help you! :)

[@UTJK.]

Thank you sir. Very helpful. You deserve a statue.

[@CodeZinx]

Thanks. This solution did not break anything on the website I'm working on and was very easy to follow compared to the others.

[@smashtheshell]

My pleasure. Great to hear! 😍

[@SiamShahriar]

Simple and Effective
hats off

[@sridharhisaria]

THANKS! I was searching was next.js as I am working on a next.js application and it worked! I created a layout.js file and put the layour there and styled the layout by min-height:100vh; and footer by the code you said and it worked thanks

[@bullatriratna9506]

Thank you sir, you are awesome keep making this kind of video. World need people like you 😊

[@bablykiran9577]

Thanku 4 such a clear code.
keep doing,all the best.

[@smashtheshell]

Thanks so much 😊

[@mohammedabdullaa952]

Thanks for your help buddy!

[@ranjithr9625]

Its Working ! Thank You.

[@atlas6234]

Thank you, it works and it is very simple and easy to follow keep up the great work.

[@Nought_8]

Thanks man u got a new sub

[@saksheetosniwal3559]

Hi Amit, this video is so helpful short and to the point! Keep Going.. It worked for my assignment as was so easy to implement:)

[@smashtheshell]

Thanks so much Sakshee, appreciate your feedback...I am really glad it helped.

[@Jaaz7]

You're the best bro.

[@gabrielscoti6835]

you saved me, thank you!

[@ale_manu]

Gracias mi hermano 🙌

[@kebab4640]

THANK YOU SO MUCH!

[@itpathshalaa]

It's awesome. Thanks a lot

[@FFUNK]

Best tutorial!

[@_jeff.medeiros]

Thank you very much my friend, you really helped me

[@MrFelipeTutoriais]

Thank you very much! That was helpful :D

[@Noname-di3yz]

Thank you so much!

[@renatoesposito543]

Thank you bro. Wel Done!

[@ShekharBhide]

Thanks s lot , I' was frustrated bcoz of this

[@nicho6227]

Thank you very much for help

[@abubacarrjawune4210]

Wonderful

[@coreylynch7876]

Thanks a lot!😁

[@MasterZeroYTTM21]

This helped a lot, thank you.

[@gatocode316]

wow, amazing!

[@vladimirgolosin4699]

This is amazing, thanks a lot!

[@maxvegra4628]

Thanks man it fixed my big problem

[@smashtheshell]

Glad I could help! 😊

[@aijiexi]

I liked and subscribed to your channel as a courtesy for helping me with this sticky command. I would like to add something however. If you set the body to 100vh, your footer will be outside your viewport. But if you set your footer to something like 5vh and your body to 95vh, when the viewport is resized, it will stay in view. Couldn't have done it without you though! Thanks!

[@gautamisane3240]

Does this work on all screens ? I had tried a solution that only works on 1366×768 screen. Considering its vh unit i can try this.

[@TobyGamez7747]

thank you so much :D

[@nicholausmdoka6632]

Thank you so much

[@abdurrakib787]

nice tactic

[@alfath-v5v]

thx you very much bro,

[@nikeshsharma1198]

thanks clear my problem

[@amarninja]

You are a legend.

[@Big_Dot_Inc]

Thank you Baba.

[@pawel80]

Thanks!

[@luv.matters]

Need help, my footer does not stick to the bottom even after this method I tried position fixed before, and it sticks the bottom part but the top always moves. I want to make my footer taller than what you have, cause when the page goes full page it breaks. It moves the footer up at the same size
Example:
position: fixed;
bottom: 0;
left: 0;
right 0;

[@hathanh8523]

nice bro !!

[@Youbernaut]

Thank you

[@abdurrakib787]

and it is work nicely

[@chirara1692]

You're my hero

[@masengeshobruno-ug1fj]

thanks alot

[@GermanDorta]

Hey, im doing but i kept going having a space in the bottom in the page and i do not why :(

[@huynguyentu2376]

thanks you !!!!!

[@EIGatito]

Bro ,header is just overlapping with main content

[@vincentstuart8664]

Fuck ya, thank you man I was really annoyed trying to figure this out

[@akk843]

Thanks

[@zenxnbeatz]

appreciate dude

[@ambokfirdaus1892]

it still does not work for me but it worth the try

[@vishwasgajawada7854]

thanks man

[@maheshm4292]

Cool

[@smashtheshell]

🙂 Thanks man!

[@basharatkhan4499]

just say thanks with respect

[@namalsachintha2451]

Thanks.

[@TheFarhanafsar]

in my case ,it is still not setting the at the bottom of the page

[@ssigitas69]

Nice, but in my case doesn't works. :(

[@elijahkaliya795]

Mine is still at the right hand corner of the page up

[@ZuPerGD]

THX

[@sanketsingh5555]

thnx sir

[@realiseeq]

❤️❤️❤️❤️❤️❤️❤️❤️❤️❤️

[@SizweMoabi15]

Super unhelpful ,got a big assignment due in 7 days

[@Hamox]

It is literally 3mins so it didn't waste any time, also if it is unhelpful then why did you watch it

[@migotrobert6952]

thanks, you came through big time

[@tochimclaren]

Its not responsive. And you cannot make footer sticky to the bottom. Another option will be to use flex box and flip it (columns) but now you body is flex box and thr content will shrink in the middle: 100% wouldn't work as expected. This is css is difficult as heck!

[@antoniofuller2331]

Hmmm

[@AbuAlRoz]

thank you my nigga

[@saifmohammad733]

[@alternativelearning3945]

Thank you so much

[@dulainguijaka6138]

thank you so much