CODEWITHSUNDEEP
htmlcssgoogle-chromebrowser
Tom
Tom

Reputation: 543

CSS buggy in chrome

On the website http://thornhillss.ca/pages.php?id=7 The footer looks fine in every browser. Yet in chrome it doesn't touch the bottom of the frame. Why is that. It should be a simple fix however I just dont know why it wont work.

*It should stick to the bottom of my div. Not my page.

Upvotes: 1

Views: 191

Answers (3)

Christopher Marshall
Christopher Marshall

Reputation: 10736

You're p.clear class has a margin on it as you're not using a reset.

If you add margin:0 to your .clear styles the margin goes away and it displays how you want it to.

Upvotes: 1

Ben D
Ben D

Reputation: 14489

This is because the div with the id "main2" isn't set to expand with the right-hand floated div. By default divs won't expand to fit floated child elements, so you need to tell it to hide overflow (which will tell it to expand to fit all child elements as long as you don't also give it a fixed height):

#main2 {
   width: 860px;
   margin-top: 15px;
   margin-left: 20px;
   margin-right: 20px;
   position: relative;
   overflow:hidden;
}

Upvotes: 1

Danferth
Danferth

Reputation: 1879

This is what you are looking for it works and is awesome sticky footer

Upvotes: 0

Related Questions