Note that there are some explanatory texts on larger screens.

plurals
  1. PObackground-size doesn't work in IE
    text
    copied!<p>I'm using this <code>class</code> and this <code>id</code> (for instance) to add a picture on one div :</p> <pre><code>.icones { background: transparent url('../contents/homepage/60/icones.png') no-repeat; display: inline-block; width: 50px; height: 48px; background-size: 60px; } #contact { background-position: 0px -60px; } </code></pre> <p>With <code>Chrome</code>, everything is ok, all looks great and all properties are shown in the <code>element inspector</code>, but in <code>IE</code>, there is a problem.</p> <p>On inspecting the page with a developper tool on <code>IE</code>, I saw that "<code>background-size</code>" doesn't appear.</p> <p>I know that it's that problem that gives me the trouble because when I hide it on <code>chrome</code> I have the same page than in <code>IE</code>.</p> <p>So my question is: How can I force <code>IE</code> to apply this <code>background-size</code>?</p> <p>THANKS!</p> <p><strong>EDIT :</strong> </p> <p>So even with the filter, it doesn't seems to work:</p> <pre><code> .icones { background: transparent url('../contents/homepage/60/icones.png') no-repeat; display: inline-block; width: 50px; height: 48px; background-size: 60px; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../contents/homepage/60/icones.png',sizingMethod='scale'); -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../contents/homepage/60/icones.png',sizingMethod='scale')"; } #contact { background-position: 0px -60px; } </code></pre> <p><strong>Solution :</strong> </p> <p>Edit the pictures size manually and forget the background-size. All is okay!</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload