Lucy Posted April 29, 2015 Share Posted April 29, 2015 (edited) I have a portfolio set up that is basically a grid of images, where if you hover over them they are covered by a semi-transparent black box with text - a title, and short description. I recently realised that IE8 doesn't support media queries, so it seems I have to set permanant font sizes that don't look awful on differently sized screens. The problem is, I can't find a happy medium with the font size for this 'overlay'. At a reasonable size, it is far too large if the browser is resized down to about 1050px wide. Making it fit into these boxes would take a tiny, tiny font size and it would look ridiculous on a larger screen. I don't want to use Javascript for this, because I remember when I used IE years ago it used to block Javascript and pop up with warnings about how dangerous it could be, so I imagine a lot of people might have it turned off. Is there any solution to this (besides completely re-designing this part of the page just for IE8 and below (I think IE9 supports media queries...))? Edited April 29, 2015 by Lucy Link to comment Share on other sites More sharing options...
dsonesuk Posted April 29, 2015 Share Posted April 29, 2015 (edited) Whoever uses IE8 these days would make it their problem, not yours, but! if you still want to make it support IE8, look at http://stackoverflow.com/questions/5769493/ie8-support-for-css-media-query they have several solutions for caveman uses of IE. versions below IE9, do not support media queries. Edited April 29, 2015 by dsonesuk Link to comment Share on other sites More sharing options...
Ingolme Posted April 29, 2015 Share Posted April 29, 2015 I would serve just the desktop styles to IE8 because, as far as I know, no mobile devices have IE8 on them. Link to comment Share on other sites More sharing options...
COBOLdinosaur Posted April 30, 2015 Share Posted April 30, 2015 If you need alternate code for ie8 then use the microsoft hack... oops workaround: <!--[if lt IE 9]> <sript src="Whatever-hack-you-need.js"></script> <![endif]--> Then you just load a script or alternate stylesheet to override the code that works for modern browsers. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now