A. Dueppen A. Dueppen - 2 months ago 40
HTML Question

How can I align Polymer paper-tabs to the right

I'm trying to build my new personal website right now, and to avoid using huge gobs of JS for what I'm planning, I'm trying to align the paper-tabs that form the site navigation to the right side of the screen, but still with a margin on the right. I can't really use CSS margins because the tabs would only look right on my screen. The site is at http://adueppen.github.io/.


If you put an element with flex attribute in the toolbar, it will fill the space where it is inserted. You can use this to right-align your tabs, like so:

<core-toolbar class="tall animate">
  <span class="bottom" flex></span>
  <paper-tabs id="tabs" selected="0" class="bottom indent" style="width: 300px">
    <paper-tab name="home"><p>Home</p></paper-tab>
    <paper-tab name="projects" ><p>Projects</p></paper-tab>
    <paper-tab name="blog"><p>Blog</p></paper-tab>
    <paper-tab name="about"><p>About</p></paper-tab>