Q: Coloring the rest of the tab I would like to color in the rest of the tab area in yellow.  In this jsfiddle only the tab top and body are are in yellow.
  <div id="tabs">
<ul>
  <li><a href="#tabs-1">Nunc tincidunt</a></li>
  <li><a href="#tabs-2">Proin dolor</a></li>
  <li><a href="#tabs-3">Aenean lacinia</a></li>
</ul>
 <div id="tabs-1">


A: Using the CSS from your fiddle:
body {
    font-size: 0.8em;
}
/*
 * Custom styles for the inactive tabs
 */
 .ui-tabs-nav li.ui-state-default a {
    background-color: blue;
    color: yellow;
}
/*
 * Custom styles for the active tab
 */
 .ui-tabs-nav li.ui-state-active a {
    background-color: yellow;
    color: black;
}
p, #tabs-1, #tabs-2, #tabs-3 {
    background-color: yellow;
}

I added the IDs of your tab <div>s and that did the trick.
fiddle

Edit
To take it a bit further, you could even add a class to your tab <div>s, then instead of adding each individual ID to the CSS, just add the class name.
