Huge White Space At Bottom Of Page

Question

I've obviously screwed up somewhere with the height in my webpage. I'm getting a massive amount of white space at the bottom of the page, way after the content. I can't find the specific problem, I've tried many different things. I thought it was time for someone else to take a look.

Here's the url:

Thanks!

remove your img tag inside your form with the `width: 110%;` and height: `150%;` or you can use this `width: 100%; height: auto;` in your img tag inside of the form — Jrey, Nov 04 '15 at 02:54

score 1 · Accepted Answer · answered Nov 04 '15 at 02:47

1

It looks like this is the issue:

img {
  width: 110%;
  height: 150%;
}

Which is causing this image to enlarge greatly:

<img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">

For images, I tend to use the following:

img {
  height: auto;
  max-width: 100%;
}

answered Nov 04 '15 at 02:47

Pete

532
5
11

1

How do I fix that? Because I need the `img { width: 110%; height: 150%; }` – LearningProcess Nov 04 '15 at 02:50
If you set that, it's going to be applied to all images. If there are only certain images you need that applied to, create a class and apply that width and height to that class only. – Pete Nov 04 '15 at 02:51
1

Thanks, the `height: auto;` fixed everything! – LearningProcess Nov 04 '15 at 02:53

score 0 · Answer 2 · answered Nov 04 '15 at 02:50

Somewhere on your page, you have this CSS:

img {
    width: 110%;
    height: 150%;
}

This is making a 1x1 image from PayPal form extremely big, and causing that big space. You should edit that code and make it apply only to the images you want, and not every image in your website.

Huge White Space At Bottom Of Page

2 Answers2

Linked