SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    789
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)

    Reponsive Design: can't get anything to work on IE....

    I can't convert my website to responsive design because I can't get anything to work on IE..

    and now I just find out that -- oh joy -- media queries don't work in IE.. gee, what a suprise, eh... stupid me, expecting IE to work like a sane browser... I'm SO SICK of everyting being a problem in IE... and when you're on a mac and don't have access to IE, even more fun.....:-o


    everything I have done for IE, every time I go to the library to test, nothing, absolutely nothing, works in IE 7 or 8

    for example, these use respond.js for the media queries for IE, but I could not get them to work in IE 7 or 8....

    http://mayacove.com/dev/rd/index3_rj.html
    http://mayacove.com/dev/rd/paper_rj.html

    do these two pages look in IE 7 & 8 the way they should look in other browsers?



    here, http://mayacove.com/dev/rd/index3_mq_script.html
    I applied another script I found for the media queries for IE..
    does this look in IE 7 & 8 the same as in other browsers?


    and here, I applied modernizr for the HTML5 tags..
    http://mayacove.com/dev/rd/test_rd_mod.html
    does this look in IE 7 & 8 the same as in other browsers?


    thank you....

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    23,598
    Mentioned
    411 Post(s)
    Tagged
    6 Thread(s)
    Quote Originally Posted by maya90 View Post
    I'm SO SICK of everyting being a problem in IE...
    At least you know you are a member of a very large and sympathetic club..

    Frankly, I see no purpose in trying to get Internet Exploder to recognize media queries. Let that browser just use the default styles (which have to be for desktop, obviously) and be done with it. Anyone clueless enough to be using IE 7 or 8 will be quite satisfied with a fixed width layout, even if it scrolls right a bit.

    If your default styles are for mobile, you could always just offer up a conditional style sheet to IE with a fixed desktop layout. That's probably easier than messing with JS, and more than IE deserves, IMHO.

    Edit:

    By the way, you certainly can test IE on your Mac. I have four versions of it installed on my Mac, via VMWare Fusion, though there are verious other options. As much as I hate IE and Windows, it is very handy to have such easy access to it. I can have multiple versions of IE open at once, alongside all my other browsers.

  3. #3
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    789
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    thank you for your help & suggestions, Ralph..

    the thing is, I'm a developer and I need to learn to make things work in IE 7 & 8...;-) I've always been very good with cross-browser/IE stuff, but this is cross-browser on a different level.......;-o

    this is the site I've been using as example for responsive design...
    www.bostonglobe.com.. they support all the way from IE6 to the devices, they also support noscript and have print stylesheets.. it's friggin' amazing, they support everything.....;-)


    I actually also did you suggest, namely just use a style sheet for IE.. (I guess should be for IE8 & older, yes?)

    so I also tested these in IE at the library yesterday..
    page 1
    page 2

    IE would just not load the stylesheet that I have in the conditional, for example

    Code:
    <!--[if IE]>
    	<link rel="stylesheet" type="text/css" href="css/ie_paper.css">
    <![endif]-->

    and if you use HTML5 tags like <section>, <article>, etc.. just doing a styleshseet for IE 7 & 8 won't cut it...right?? ;-) that's where modernizr comes in, yes?

    thanks again.....

  4. #4
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    789
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    so regarding modernizr... does this work in IE 7 & 8?

    (i.e., does it look the same in FF, Chrome, Safari, as it does in IE??)

    thank you....

  5. #5
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    789
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Ralph,

    this VMWare Fusion that you mentioned, you don't have to restart your machine to switch from mac os to windows, right? because I know with some of these things you do have to do that....
    not being able to test on IE is simply not an option with all this RD stuff, media queries, HTML5.... because of course EVERYTHING is a problem in IE.... (gasp....;-)


    thank you...



    (PS (edit): of course what this tells me also is that any IE browser older than IE9 will land in the dustbin of history double quick....;-) I know IE9 and above are much less problematic....)

  6. #6
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    23,598
    Mentioned
    411 Post(s)
    Tagged
    6 Thread(s)
    Quote Originally Posted by maya90 View Post
    this VMWare Fusion that you mentioned, you don't have to restart your machine to switch from mac os to windows, right?
    Yes, same with Parallels and even the free alternative of VirtualBox (I believe). Basically you can have IE (even in multiple versions)—along with all the other Windows browsers, for that matter—open along with all your other Mac browsers. It works seamlessly, and is very handy indeed.

  7. #7
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    789
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    so here I have two pages...

    http://mayacove.com/dev/rd/index3_ie.html
    http://mayacove.com/dev/rd/index3_ie_mac.html

    in both am loading IE stylesheet.. one (the first one) with a conditional for IE... the other one (ie_mac.html) am loading exact same stylesheet, but w/o the conditional for IE.. yet when I go to the library and load these two pages in IE they look completely different why is this? (they look fine in IE9 & 10, but in 8 & 7 it's like they're not reading the ie_index.css at all..)

    I don't get this at all.. here are screenshots I managed to at the library yesterday:
    http://mayacove.com/dev/ie.gif
    http://mayacove.com/dev/non_ie.gif

    you can't see it very well in these screenshots, but you can see they're loading diff style sheets...

    don't get what's happening....


    in this one
    http://mayacove.com/dev/rd/index3_ie.html

    have:

    Code:
    
    <!--[if lt IE 9]>
    	<link rel="stylesheet" type="text/css" href="css/ie_index.css">
    <![endif]-->

    in the other one,
    http://mayacove.com/dev/rd/index3_ie_mac.html

    I have the same thing w/o the conditional...

    they both look the same in all browsers, except in IE 7 & 8 they look completely different.... why is this?


    thank you...






    thank you....

  8. #8
    SitePoint Wizard
    Join Date
    Feb 2007
    Location
    Southern California
    Posts
    1,316
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    You may want to look into respond.js:

    http://www.webmonkey.com/2011/04/how...nd-eat-ie-too/
    Steve Husting

  9. #9
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    789
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    yes I have looked into response.js...

    here's an example with response.js...


    does it look the same in IE 7 & 8 as it does in IE9 & 10 (& the other browsers)?

    thank you.....


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •