title: Flexbox: Justify content: flex-end
body: <p>I have problems with implementing justify content using flexbox. I want my language and social media bar to be floating right in the flex container. I'm using chrome, so I have -webkit prefixes in my code snippet. What am I doing wrong? According to W3C spec and to Chrome Dev tools, my approach should be correct, but maybe I'm wrong.</p>
  
  <p>Thanks in advance for your replies.</p>
  
  <p>code snippet:
  HTML:</p>
  
  <pre><code>&lt;div id="upBar"&gt;
          &lt;div id="languagePanel"&gt;
              &lt;ul&gt;
                  &lt;li&gt;&lt;a href="#"&gt;Eng&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#"&gt;Ger&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#"&gt;Fr&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
          &lt;div id="media"&gt;
              &lt;ul&gt;
                  &lt;li&gt;&lt;a href="#"&gt;FB&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#"&gt;mail&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>#upBar{
      display: -webkit-flex;
      -webkit-flex-direction: column;
  }
  
  #languagePanel, #media{
  -webkit-justify-content: flex-end;
  display: block;
  }
  </code></pre>