Problem IE - Width <li>not adaptative.

With IE 11, on window resize, width of <li> don't fit content.

HTML

<ul>
  <li>
    <img src="http://img4.hostingpics.net/pics/404788P1010437s.jpg" alt="{{txt_video_title}}" />
  </li>
  <li>
    <img src="http://img4.hostingpics.net/pics/404788P1010437s.jpg" alt="{{txt_video_title}}" />
  </li>
  <li>
    <img src="http://img4.hostingpics.net/pics/404788P1010437s.jpg" alt="{{txt_video_title}}" />
  </li>
  <li>
    <img src="http://img4.hostingpics.net/pics/404788P1010437s.jpg" alt="{{txt_video_title}}" />
  </li>
  <li>
    <img src="http://img4.hostingpics.net/pics/404788P1010437s.jpg" alt="{{txt_video_title}}" />
  </li>
  <li class="last_item">
    <img src="http://img4.hostingpics.net/pics/404788P1010437s.jpg" alt="{{txt_video_title}}" />
  </li>
</ul>

CSS

body,
html{height:100%;}

ul{
  margin:0;
  padding:0;  
  list-style: none;
  overflow:hidden;
  display:inline-block;
  height:20%;
  width:100%;}

li{
  display:inline-block;
  height:100%;
  margin-right:3px;
  background-color:red;}

li.last_item{margin-right:0;}

img{
  border: 0 none;
  display: block;
  vertical-align: middle;
  height:100%;}