Footer on IE9

HTML & CSS
1

Hi there, I need some help finding out why the footer in www.sntravel.co.uk is moved to the left on IE9 only.

I have a separate stylesheet for it but can’t seem to make it move to full page width

2

Where? I don’t see it.

3

Hi,

The footer is broken in all versions of IE because you have zoomed it smaller here.

/*media screen and (min-width: 1300px)*/
#footer {
    zoom: 0.9;
    margin-left: 0px;
    margin-top: 50px;
    position: relative;
    background-color: #fff;
}

Remove the zoom as that is IE specific and if it is there as a hack to apply haslayout for IE7 and under then it needs to be zoom:1.0 and nothing else.

4

I just spent 30 mintues trying to fix it Paul and I was 2 minutes late. That’s frustrating!

Browserstack is impossibly slow.

5

But I need the zoom for that screen size.

my stylesheet sn-ie.css has #footer {zoom:1 !important} on it but it doesn’t seem to work.

6

You shouldn’t be using zoom.

And as Ralph said, I don’t know where that IE stylesheet is being called

7

You don’t need zoom at all. Get rid of it. Its not valid CSS and is a hack for IE7 and under only and should only ever be used as zoom:1.0 anyway.

It would work if it that file was included in the page :slight_smile:

8

Sorry :smile:

9

Ok I see, I probably removed it by error when adding the responsive menu.

So how do I actually reduce the size of the footer then depending on the screen size?

10

It should get smaller. I just tested. I closed my browser width. It’s responsive. You set percentage widths on the footer so that’s good. It will update. What do you want to happen (apposed to what IS happening?)

11

If you remove the zoom on chrome you can see the difference, its too big.

12

Zoom property doesn’t exist for Chrome.

Also, yes it’s big but you have content that makes it that big. So again, what do you WANT to happen (apposed to what IS happening?)

Right now, you need to remove content to make it smaller / shorter.

13

I see, I will reduce font size and image size, thanks :smiley: you can close this post
Thanks everyone for the help

14

Actually chrome does implement zoom and has done for some years (not sure why though).

You would never use zoom (or the css3 scale()) for structural layout. It’s really only used for effects.

If your content doesn’t fit in the space available then adjust the content with your media queries ( and preferably not just making the font-size smaller either unless it is large to start with).:slight_smile:

15

yeah I did, will test on different screen sizes when I get back home :stuck_out_tongue:

16

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.