Grow your CSS skills. Land your dream job.

html5shim/v

  • # July 26, 2011 at 6:56 pm

    So while on a friends machine, I loaded the page I was working with, http://people.ysu.edu/~jtpenezich, on IE8, using the shim/v it wont load any of the html5 containers correctly. Any ideas? Also,http://browsershots.org (a website to test sites for ie) shows it the same way. Also nearly positive javascript was turned on.

    # July 26, 2011 at 7:46 pm

    You don’t even need the shiv – you’re not using any of the new html5 elements.

    For me, it’s showing everything fine except for the background and box shadows. The box shadows you can forget about and you need a background fallback (or separate stylesheet) for IE

    edit// it appears you have a fallback background image (why not just a color?) but it has a bad url

    # July 27, 2011 at 1:54 pm

    Yeah, I switched them all to normal divs from header/section/nav/footer/aside. Because the shiv never worked.

    # July 27, 2011 at 7:04 pm

    @Jeager Did you set all HTML5 elements to display: block? You still need to do that manually, even when using the shim.

    # July 27, 2011 at 7:22 pm

    Yeah, I had the reset up. And now that I set them all to divs, it still isnt loading properly in IE6-8. But works normally in everything else, even FF 3.6.

    # July 27, 2011 at 8:01 pm

    Does it validate?

    # July 27, 2011 at 8:01 pm

    did you see where I pointed out that you have bad urls in the background image rules?

    # July 28, 2011 at 3:49 am

    Im not seeing the bad url. Also, I have it as a graphic rather then a solid color to be able to have the transparency regardless of browser. Also, just did a validate, besides the image not having alt tag, it checks out.

    Edit: The only background descrepency I saw was with a background-position: whatever; while declaring a background: rgba(); — Not sure if it would take both into account, but I fixed that, however wouldnt change the problem im having in IE 6 with the shim. However, the background was messing up as well, and I declared a filter for IE

    body {
    line-height: 1;
    font-size:62.5%;
    background:#5cbc04;
    background:transparent;
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffff,endColorstr=#5cbc04);
    zoom: 1;
    background:url(../images/background_gradient.png) repeat-x #5cbc04;
    font-family: Arial, Helvetica, sans-serif;
    }

    And after some more messing around after my meeting with the client, she wanted the content box to be more centered. Works in every browser except IE5-6, which the right column, with the map, gets pushed down.

    Edit2 ::: Found it. % =/= good. I fixed it then forgot to ftp it onto the site, thinking I didn’t find the problem. But works now, However there’s just the one issue of the weird gradient, is the fallback correct? Seems to work fine, just wondering if its semantic. Also the right column with the map being pushed down. Seems to be the only problems left.

    # July 28, 2011 at 7:14 am

    You really don’t need to worry about IE5/6.

    # July 28, 2011 at 1:40 pm

    I’m going to guess the shim/v wasn’t working due to the background error. But whats the likely hood of someone having java off, or updated. If the user is using a crappy browser, wouldn’t they more then likely not even know what javascript is? So im wondering if I should return all my divs to html5 or just keep them there. Or will the reset to display:block be enough to render them correctly anyways.

    # July 28, 2011 at 7:28 pm

    I’d say go ahead with the shiv and new elements. If it still doesn’t work, there’s another problem to sort out, but it should work.

    # July 28, 2011 at 8:04 pm

    I second that.

    # July 29, 2011 at 2:19 am

    Roger that. I’ll reset them and if the new elements work with the shiv i’ll mark as solved. Im pretty sure it was only the background problem as wolf pointed out though.

    Edit: Yup, solved.

    # July 29, 2011 at 5:19 am

    Good one!

Viewing 14 posts - 1 through 14 (of 14 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".