Facing the problem to set the footer to the bottom of the page.

Question

I am trying to clone the Amazon Web site i am intermediate in web development. I face the problem of setting footers to the bottom of the page for long content and also suggest other improvements in code another issue if you can help solve that my contact overflow and if i use overflow hidden then it show half div contact i don't won't half show full otherwise hide
https://sololearn.com/compiler-playground/WN9f90OoAu3R/?ref=app

Answer 1

I believe the problem is with your absolute positioning. That removes those elements "out of the normal flow". So the footer doesn't see/know that there are things above it.

Answer 2

That sounds good to me. Does it look the way you want it to?

Answer 3

First of all thank you for solving problems. Ya it works when I am removed but i need to be in the top 25%. other way to solve this problem ?

Answer 4

I'm sorry, what do you mean by the top 25%?

Answer 5

.products-layout i give it to the position absolute and top 25% due to this position i have faced problem to set footer to the bottom you suggest that remove position. I found it working but now how i set the top 25% but i use margin-top to solve the issue.
Is it the correction way ? And thanks again for solving my issue

Answer 6

Yes but if you can suggest more improvement then it will be more helpful for me to check this review link or repository code on github https://aayushparmar.me/amazon-clone/

Answer 7

.absolute-bottom{
position: absolute ;
background: #000;
bottom: 0;
left: 0;
width: 100vw;
}
but it won't help as the element above it apparently has an uncontrolled size and positioning