Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Content vanishes under footer!

Featured Replies

Hi guys & gals,

 

I have a problem with my footer and it's doing my nut in!

 

When I test my pages in IE the page content dissappears under the footer instead of there being a scroll bar, yet it's fine in Firefox!

 

http://www.webexpress-uk.com/packages.html

 

Can anyone help? PLEASE!!

 

:help:

Either you've fixed it or you're not on IE/FF on PC. It looks fine to me.

 

Btw I can see the plain white of your page body because your background is only 1600px wide. :)

  • Author

Really? That's weird...this is what I see in IE!

 

clicky

 

:huh:

 

p.s. You mentioned the white body background...what should the background width be in that case?

Ahh i'm using IE6 mate, can't really say without playing about with it on IE7.

 

Looking at the source i see 2 end body and html tags, so i'd fix those to begin with.

 

Your footer is 5em high, so you probs need to add margin or padding to the bottom of the div above the footer to prevent this.

Oh yeah and i'm using 1680x1050 which is quite common now if you ask me. I also know plenty that use 1920x1200 and some even higher so it's best to avoid this type of Y only repeat.

  • Author

Ok thanks Tucker, I'll see if someone with IE7 can shed any light on it!

 

:good:

  • Author

EDIT: I am baffled...it's fine in Firefox but not in IE7. Can someone shed any light on this?

 

Thank you!

 

*bashes head on desk* :help:

It is this :

 

#footer {
 clear: both;
 float: left;
 width: 100%;
 height: 5em;
 margin-top: -5em;
}

 

Get rid of the margin-top: -5em and the content reappears

 

- Eris

  • Author
It is this :

 

#footer {
 clear: both;
 float: left;
 width: 100%;
 height: 5em;
 margin-top: -5em;
}

 

Get rid of the margin-top: -5em and the content reappears

 

- Eris

 

Cheers Eris! I think I've FINALLY sorted it though! I just needed to change the <div id="content"> to <div id="page">

 

My God that was doing my head in...lol

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.