Fluid Grid Layout - IE Issue with Image Size

Question

Hi,
I've been working on a new website using the CS6 Fluid Grid Layout. My site is working correctly in Chrome and Firefox but in Internet Explorer 9 and 10, and most likely all other versions, the images that resize normall in Chrome and Firefox stay at maximum size in Internet Explorer. Please could somebody take a look at my site and see where I have gone wrong in the code as I can't find the problem anywhere.
www.moleseyhire.com/index2.html
Kind regards,
Mitchell Ransom

Answer 1

You could set the <divs> up like:
<div id="special_1"><img src="http://www.moleseyhire.com/images/offer-1.png" alt="33% Off Shampoo"></div>
  <div id="special_2"><img src="http://www.moleseyhire.com/images/offer-2.png" alt="Multi Hire"></div>
    <div id="special_3"><img src="http://www.moleseyhire.com/images/offer-3.png" alt="Multi Buy"></div>
    <div id="special_4"><img src="http://www.moleseyhire.com/images/offer-4.png" alt="10% Off Tile Cutter Accessories"></div>
Then add
#special_1, #special_2, #special_3, #special_4 {
    width: 24%;
    float: left;
    margin-right: 1%;
To the following media queries:
@media only screen and (min-width: 769px) and @media only screen and (min-width: 481px)
and:
#special_1, #special_2, #special_3, #special_4 {
    width: 49%;
    float: left;
    margin-right: 1%;
to the following media query:
/* Mobile Layout: 480px and below. */