Problems with IE8

HTML & CSS
1

Hi

I’ve just realized that all my hotel pages that work fine in all browsers, do not work in IE8 and are in a mess. On first sight it has an easy solution through a html conditional, but I’ve tried reducing the size of the .box; max-width, overflow:hidden a few more and can’t make it work.

I’ve been working on http://pintotours.net/Oceania/Australia/Sydney.html. Then press the button “look inside” for the first hotel “Hilton Sydney”.

if you try this on any nodern browser the 4 images appear 2x2. In IE8 the first line has 3 images, one being outside the box and all the rest of the page is chaotic.

Incidentally, if you copy the url of the pop-up (which is not a pop-up) and paste it on the address bar that part of the page appears now with sidebars.

But my problem seems to be in the pop-up accessed from the main page.

Thank you

2

IE8 for me displays 2x2; both in the popup and copying the URL to a new tab. Could you clear your cache?

3

I did!

I’m going to throw the computer away!

Could you send me a screen shot of what you see in the pop-ups?

Thanks

4

I’m on my chromebook (took today off from work), so screenshots are a pain, but IE8 looks like Chrome. Just imagine that.

5

Well. Ive cleared the cache a hundred times, restarted and still the same: a mess!

Could it be the size of the computer? It’s a Compaq Mini, the zoom is on 100% and I get the same result in all 100 or so hotels in the various pages!

PS- I’ve tried before to upload images to the forum without success. What’s the secret?

6

You can just drag and drop the images onto the text editor.

7

Hi

If I try to drag &drop a local page opens with the image and the Sitepoint page disappears. If I try to upload it nothing happens.

Is there a different way?

8

You should be able to upload images no bother. There are instructions in this post for multiple methods: Discourse Cheat Sheet

Which browser are you using?

(I sometimes find it takes a while to start uploading, especially for a large image.)

9

Ahhhh…

IE9. I’ll try with another one,

Thanks

10

833×541 75.3 KB
813×544 81.2 KB

Firefox: no prob!

1 Like
11

Weird, Windows7 IE8 doesn’t exhibit this problem (at least it didn’t yesterday) but the XP version of IE8 does.

One moment while I investigate…

12

The problem is that you set the max-width 650px on .box inside of a media query which IE8 doesn’t recognize.

As a result, the 800 some pixel width is being applied (set in another part of your CSS) and is pushing the responsive container outwards and making 3 boxes line up (more room = 3 can now fit on the line). The max width isn’t being recognized so it’s not being contained anymore to within the 650px max width.

So you need to (outside of your media query) set your max-width:650px on .box

13

Great, Sherlock!

I will try as a html conditional, but if it works I have to do it on 100 pages…

Could I do a IE8 conditional in the css?

14

You can’t have an HTML conditional inside of a CSS file. But you can write the CSS inside of your CSS file that is being called from your conditional comment (I think you had one? Unless I’m going crazy.)

Doesn’t matter where you have it.

Ideally you have the same CSS file across all pages - the whole point of doing external files is so you can throw that onto all pages and if you need a change, everythings updated :wink: .

15

Success?

It starts working on max-width:640px; with lost so empty space between. I reduced it gradually and it broke again on 580px, So, I put it on 590px, where it looks reasonable.

Anything against that?

Now, I’m gtrying to decypher your last message.

How am I going to that in the stylesheet to target only IE8?

A FEW MINUTES LATER…

It works for the HIlton, but not for the others, back to the drawing board?

Forget it! Of course, it doesn’t I haven’t altered the others…

Sorry…

16

Sorry Ryan, but can you explain how I can do that, please?

Thanks

17

LATER…

I’ve sorted it out by inserting the conditional in each html file.

Thank you, again!

18

Sooooooooooooooooo…

All set? :slight_smile:

19

I’ve decided to give you a few days off to top up your 45 days annual leave.

But it’s not a promise!

Best!

20

Oh man don’t I wish…

Sound like a client now :stuck_out_tongue_winking_eye: .