gerkintrigg Posted July 23, 2012 Share Posted July 23, 2012 Hello, I have this page: http://www.truro.com which looks just as i want it to in Safari, Firefox, Chrome... even Rockmelt! (Hands up if you have heard of THAT one?) But... Internet explorer (our old friend) is displaying a ghastly white box. The corners aren't rounded and the background isn't faded. Can anyone here suggest what's going wrong? Here's my CSS: #homepage_logo { text-align:center; background:transparent; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99FFFFFF,endColorstr=#99FFFFFF); zoom: 1; background: rgb(400, 400, 400); /* The Fallback */ background: rgba(400, 400, 400, 0.6); width:550px; margin:auto; border-radius:15px; -moz-border-radius: 15px; } Quote Link to comment Share on other sites More sharing options...
Mahngiel Posted July 23, 2012 Share Posted July 23, 2012 the sooner people stop developing *for* IE, the sooner people will abandon it. I, for one, have stopped shiv'ing, shim'ing, poly'filling, and generally giving a shit for IE and those who use it to view the interwebs. Now, three things: 1) According to Can I Use?, IE9 supports border radius, if the IE you're talking about isn't v9, then fugettaboutit. 2) There's no reason to use the -moz prefix (or generally any prefix) for border-radius since... a while ago ( about a year). 3) rgb(400,400,400) is not a valid color code, nor is your color string. RGB works from 0 - 255 while hexcodes are 6 digit alphanumeric codes. Quote Link to comment Share on other sites More sharing options...
gerkintrigg Posted July 23, 2012 Author Share Posted July 23, 2012 mmm 255 - That makes sense. I don't want to have to develop for IE, but it is still (sad to say) the most popular browser, so I have to. Quote Link to comment Share on other sites More sharing options...
Mahngiel Posted July 23, 2012 Share Posted July 23, 2012 I don't want to have to develop for IE, but it is still (sad to say) the most popular browser, so I have to. Shame. I edited my post, not sure if you seen it... filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99FFFFFF,endColorstr=#99FFFFFF); that color code is incorrect Quote Link to comment Share on other sites More sharing options...
Jessica Posted July 23, 2012 Share Posted July 23, 2012 Actually I think those color codes are valid, the first two have to do with opacity. I've seen that before and it's an IE thing. Quote Link to comment Share on other sites More sharing options...
Mahngiel Posted July 23, 2012 Share Posted July 23, 2012 Actually I think those color codes are valid, the first two have to do with opacity. Hexcodes do not have transparency factors. this page explains quite well (section 2.1 towards bottom). The nature of the hexcode itself just doesn't permit it. Quote Link to comment Share on other sites More sharing options...
Jessica Posted July 23, 2012 Share Posted July 23, 2012 And yet, IE accepts them that way. http://msdn.microsoft.com/en-us/library/ms532847(v=vs.85).aspx (see the third box example) http://msdn.microsoft.com/en-us/library/ms532878(v=vs.85).aspx Quote Link to comment Share on other sites More sharing options...
Mahngiel Posted July 23, 2012 Share Posted July 23, 2012 touche, jesi. more to reason why this thread is aptly titled. Further information: IE's rendering engine may have scripts to convert the 8 digit hexadecimal to an RGBa, but W3G states Unlike RGB values, there is no hexadecimal notation for an RGBA value. Quote Link to comment Share on other sites More sharing options...
gerkintrigg Posted July 23, 2012 Author Share Posted July 23, 2012 Yup, IE is pants. The hex code in that example is done because of Microsoft bodging the alpha channel. I heard that IE 8 doesn't support CSS 3 - which explains a lot. Did anyone work out how to make it look like Safari / Opera / Chrome / Rockmelt / Firefox.... Well... any of the others? Neil Quote Link to comment Share on other sites More sharing options...
Jessica Posted July 23, 2012 Share Posted July 23, 2012 As far as I am aware, the only way to do that in IE8 will be using a transparent .png. Quote Link to comment Share on other sites More sharing options...
gerkintrigg Posted July 23, 2012 Author Share Posted July 23, 2012 ah. Set it as a background image and leave the background (color) variable blank? Quote Link to comment Share on other sites More sharing options...
Mahngiel Posted July 23, 2012 Share Posted July 23, 2012 Did anyone work out how to make it look like Safari / Opera / Chrome / Rockmelt / Firefox.... Well... any of the others? Making IE play nice with current web standards is a difficult task. It takes a complete second approach to design methodologies and requires its own design pattern. This increases the time and cost of production and for the sake of the internet should be avoided like the plague. Sadly, Microsoft never implemented silent updates to previous versions of Internet Exploder and thusly, a majority of internet users do no know they need to update their browsers. With designers being pushed by clients to reach every available audience in order to increase presence, awareness, and revenue, the community finds itself facing this challenge. This cycle will perpetuate until we grab our cohones and say "enough is enough" in regards to legacy software that has no current relevance. Only then, when users of said outdated browsers begin to recognize that the internet doesn't work the way it used to will we see a migration. Want to stop worrying about supporting old software and wasting hours tediously ensuring your modern design is no longer modern to support the fools who rely on Microsoft to do everything for them? It's easy. Stop supporting them. /rant Quote Link to comment Share on other sites More sharing options...
gerkintrigg Posted July 23, 2012 Author Share Posted July 23, 2012 That's done it Jesi! Now all I need to work out is the damn curved corners. Urgh! IE really is rubbish. Quote Link to comment Share on other sites More sharing options...
Jessica Posted July 23, 2012 Share Posted July 23, 2012 Well I'd do the corners in the image but there might be a better way. Quote Link to comment Share on other sites More sharing options...
xyph Posted July 23, 2012 Share Posted July 23, 2012 Using a transparent PNG in this case is WAY better IMO - for ALL browsers. Heck, you don't even need a transparent PNG. Make that all one image, and use absolute positioning to place your input, and use an image/link map to create the links on the image. Avoid transparency if you can... it's hell on slower machines, and usually pretty 'hacky' due to lack of good Windows/IE support (pre 7/9 respectively). There's are times when transparent PNGs or elements are the _only_ way to sanely create a desired effect, but this isn't one of them. Quote Link to comment Share on other sites More sharing options...
gerkintrigg Posted July 23, 2012 Author Share Posted July 23, 2012 Shame really but I can do the rest. Thanks guys. Quote Link to comment Share on other sites More sharing options...
xyph Posted July 23, 2012 Share Posted July 23, 2012 Did anyone work out how to make it look like Safari / Opera / Chrome / Rockmelt / Firefox.... Well... any of the others? Making IE play nice with current web standards is a difficult task. It takes a complete second approach to design methodologies and requires its own design pattern. This increases the time and cost of production and for the sake of the internet should be avoided like the plague. Sadly, Microsoft never implemented silent updates to previous versions of Internet Exploder and thusly, a majority of internet users do no know they need to update their browsers. With designers being pushed by clients to reach every available audience in order to increase presence, awareness, and revenue, the community finds itself facing this challenge. This cycle will perpetuate until we grab our cohones and say "enough is enough" in regards to legacy software that has no current relevance. Only then, when users of said outdated browsers begin to recognize that the internet doesn't work the way it used to will we see a migration. Want to stop worrying about supporting old software and wasting hours tediously ensuring your modern design is no longer modern to support the fools who rely on Microsoft to do everything for them? It's easy. Stop supporting them. /rant I think the biggest issue is developers/designers starting to rely on non-standard CSS. CSS3, like HTML5 is still draft, so there's no 'right way' to do it at the moment, just implementation of potential behaviour. Think about rounded corners. -moz-border-radius: 20px; -webkit-border-radius: 20px; -khtml-border-radius: 20px; border-radius: 20px; And that's for post IE8, post Opera10.1 browsers. If you want those as well, you've got even more hacks It's not limited to IE, it's a generic problem of people implementing mark-up before it's standardized or finalized, and each browser engine having it's own implementation of the unfinished proposals. If you want to move towards the nearly-no-image style website, get ready to test like mad in EVERY browser (they ALL have their quirks), and abandon older ones Quote Link to comment Share on other sites More sharing options...
Mahngiel Posted July 23, 2012 Share Posted July 23, 2012 I think the biggest issue is developers/designers starting to rely on non-standard CSS. ... It's not limited to IE, it's a generic problem of people implementing mark-up before it's standardized or finalized, and each browser engine having it's own implementation of the unfinished proposals. thread hijacked. sorry There was a large to-do about this a few months ago in the design community. So many designers were in love with the neat tricks browser-prefixes could do and they started implementing them on production designs. [wag:finger] You're correct, it perpetuated to an astronomical level and now so many sites have this beta-level coding their designs are dependent on. The browser devs are now almost forced to maintain code for those beta features. Such is the game we play. Devs chase the latest frameworks, libraries, and languages; and designers have caused such a mess for themselves and entire market of fills, shivs, and hacks has emerged solely so they can play with new toys. I admit, however.. the game is fun! Looking back at MS & IE, however. Now that IE10 will receive silent updates it'll be less of a hang-up. It's just a matter of hoping people get off IE6 as quickly as they've gotten off of XP Quote Link to comment Share on other sites More sharing options...
gerkintrigg Posted July 23, 2012 Author Share Posted July 23, 2012 I still use XP. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.