Internet Explorer distorting images

  • Author
  • #1737557


    Hi there all, I’m creating a website and was having some trouble with images in Internet Explorer stretching, shrinking and distorting. I placed an image in the site title of the website as well as placed a few linked images in the widget sidebar area. I made the top image responsive, yet IE is still distorting the images. The website is

    Here is the css:

    /*The main theme structure - reduce top margin to compensate for changes to Header*/
    	margin-top: 12px;
    /*=Header - add clickable logo to title*/
    #site-title a {
    	max-width: 100%;
    	height: auto;
    	width: auto9; /*ie*/
    	padding: 7px 0 7px 78px; /*allow space for image*/
    	background: url(images/image.png) no repeat;

    And here’s the responsive php:

    <h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><img src="image.png"
    /*make image responsive*/
    class="site-title" max-width="97.5%" /*changed from width="100%"*/ height="auto" width="auto9" /*for ie*/  alt=""/>

The topic ‘Internet Explorer distorting images’ is closed to new replies.