title: Media queries, inline blocks and text-align justify
body: <p>I got a problem with aligning elements using inline blocks
  It's all normal when i just using technique with <code>"text-align: justify"</code></p>
  
  <p>but when i put all in media query then nothing happens</p>
  
  <p>(elements not aligning width <code>text-align: justify</code>)</p>
  
  <p>here is the fiddle how it shoud be</p>
  
  <pre><code>ul {
      text-align: justify;
      width: 100%;
  }
  
  ul:after {
      content: " ";
      display: inline-block;
      width: 100%;
      background: #000;
      height: 10px
  }
  
  ul &gt; li {
      display: inline-block
  }
  </code></pre>
  
  <p><a href="http://jsfiddle.net/2t6vm/" rel="nofollow">http://jsfiddle.net/2t6vm/</a></p>
  
  <p>and there is example width my problem (try to resize result frame)</p>
  
  <pre><code>@media only screen and(max-width: 479px) {
       same css
   }
  </code></pre>
  
  <p><a href="http://jsfiddle.net/FYLQq/" rel="nofollow">http://jsfiddle.net/FYLQq/</a></p>