IE not viewing images properly

  • doodledave

    (@doodledave)


    7 years, 1 month ago

    Hi all…
    I have a Custom WordPress theme on a live website:
    http://www.blakehall.co.uk

    I launched it a few months back but the client has come back with an issue affecting the Blake Hall site as viewed on Internet Explorer 9, 10 and 11 (fine on all other browsers and MS Edge).

    All browsers apart from IE9, IE10 and IE11 are showing the images resized perfectly – IE is showing them at actual size… I can’t reload the images at the actual viewing sizes as they are used multiple times throughout the size with different treatments.

    Does anyone know know how I could get around this…

    http://www.dbcj-dev.co.uk/db/reference/ie9-11.png

    You’ll see from this image that the images as viewed on IE9, IE10 and IE11 are showing as actual size rather than as is looks on all other browsers:

    Please let me know as soon as you can – If you can just give me the CSS I need I can put it in myself.

    Many many thanks
    David

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • Anonymous User

    (@anonymized-14834838)

    7 years, 1 month ago

    Internet Explorer does not automatically contain images to the size of the parent by the use of a max width. Your images have the html width attribute defined (your example is 2074px). To fix this you just need to add a width of 100% to the css for images and they should resize fine.

    Try adding the following to your css:

    img.attachment-full {
    width:100%;
    }

    or

    img.image {
    width:100%;
    }

    You may need to play around with which class you use to make sure only the images you want to resize do so.

    Thread Starter doodledave

    (@doodledave)

    7 years, 1 month ago

    That seems to have done the trick (on the emulator, anyway)
    Thanks so much Steve.
    Dave

    Thread Starter doodledave

    (@doodledave)

    7 years, 1 month ago

    ah… now the text is piling under the images instead of alongside right…
    anything I can do to rectify this new problem?

    Thanks

    Anonymous User

    (@anonymized-14834838)

    7 years, 1 month ago

    I can only replicate this in IE9 and below, IE10+ works fine for me. Ive had a look and it appears you are using flexbox to handle layout? That is only partially supported in IE10+ and not at all in previous versions which explain the problem (turning disabling the flexbox css in Firefox causes the same layout).

    To fix specifically those two blocks on the home page try using IE condcoms to specify this css in the <head> section of your website (no promises):

    <!--[if gte IE 7]>
    <style>
     #pgc-w59b303410069e-0-0,
     #pgc-w59b303410069e-0-1 {
       display:inline-block;
     }
     #pgc-w59b303410069e-0-0 {
       margin-right:30px;
     }
    </style>
<![endif]-->
    Thread Starter doodledave

    (@doodledave)

    7 years, 1 month ago

    Thank you very much.
    D

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘IE not viewing images properly’ is closed to new replies.