title: CSS Header style not applied to children
body: <p>I am beginner to UI World, trying to style and arrange html components in one of my example, but I could not see the style applied for all the children of HTML header component. Here is what I have tried <a href="http://jsfiddle.net/q0aam4xn/" rel="nofollow">Demo in JsFiddle</a>  </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.page_header_style {
      border: 1px solid blue;
  }
  .title_style {
      text-align:center;
  }
  ul {
      list-style: none;
  }
  li {
      display: block;
  }
  .user_style {
      float: right;
      margin-top: 0px;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;header class="page_header_style"&gt;
      &lt;div&gt;
          &lt;div class="title_style"&gt;Main Title&lt;/div&gt;
          &lt;div&gt;
              &lt;ul class="user_style"&gt;
                  &lt;li&gt;Welcome Srk&lt;/li&gt;
                  &lt;li&gt;&lt;a href=""&gt;Logout&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/header&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I would like to see the second div i.e., Welcome message &amp; a list in the same line of the title, keeping the title at the center.</p>