title: Using :after CSS selector to fill a space?
body: <p>On <a href="http://carolineelisa.com/indigo/2012" rel="noreferrer">this page</a> I wish to have the entire space to the right of the navigation filled in white.</p>
  <p>So, I achieved 5px wide white block using the :after CSS selector, and am hoping there is a way to make it fit the available width, although I am open to other suggestions!:</p>
  <pre><code>#menu-main-menu:after {
      content:&quot;&quot;;
      display:block;
      background:#fff;
      width:5px;
      height:30px;
      float:right;
      }
  </code></pre>
  <p>Here is the simplified HTML:</p>
  <pre><code>&lt;div class=&quot;menu&quot;&gt;&lt;ul id=&quot;menu-main-menu&quot;&gt;
  &lt;li&gt;&lt;a href=&quot;#&quot;&gt;Home&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href=&quot;#&quot;&gt;About us&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href=&quot;#&quot;&gt;Courses &amp;#038; prices&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href=&quot;#&quot;&gt;Activities in Rio&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href=&quot;#&quot;&gt;Accommodation&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href=&quot;#&quot;&gt;News&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href=&quot;#&quot;&gt;FAQs&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href=&quot;#&quot;&gt;Contact&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  <p>And all the relevant CSS:</p>
  <pre><code>#primary-menu ul {
      overflow:hidden;
  }
  #primary-menu li {
      list-style:none;
      float:left;
  }
  #primary-menu a {
      color:#333;
      background: #fff;
      display:block;
  }
  #primary-menu .current-menu-item a, #primary-menu .current-page-parent a {
      color:#fff;
      background:none;
  }
  #menu-main-menu:before {
  content:&quot;&quot;;
  display:block;
  background:#fff;
  width:20px;
  height:30px;
  float:left;
  } 
  #menu-main-menu:after {
  content:&quot;&quot;;
  display:block;
  background:#fff;
  width:5px;
  height:30px;
  float:right;
  }
  </code></pre>
  <p>Thanks for taking the time to check out my question!</p>
  <p>Caroline</p>