Figured out I had some bad CSS and unclosed tags. Once I worked those out, all aligned good. It was all in an attempt to make left and right columns (w/left nav) and have editable zones in both the master page and individual pages.

I'm trying to setup a master page to have left navigation and right content. Although I would like the left column to have the navigation, and a webpart zone below that is editable from the root level. Then from an individual page level I'd like to have a webpart zone below the root webpart zone to customize whatever they'd like within each of those pages. For instance, website has 100 pages and all 100 of the pages have 2 google ads just under the left nav. But when someone navigates to a nested level, say website.com/Products/Details/ the designer would be able to add another google ad below the other 2 ads on the master but not remove the 2 ads that were already on there.

Here is my simple layout:

<div id="header"></div>
<div id="page" class="container">
  <div id="page_inner" class="row">
    <div id="sidebar">
      <div id="sidebar_inner">
        <div class="nav">
          <cc1:CMSWebPartZone ID="zoneNav" runat="server" />
        </div>
        <div class="aside">
          <cc1:CMSWebPartZone ID="zoneSide" runat="server" />
          <!-- have webparts in here for main master page and works great -->
          <!-- want to have this area editable after the webparts I enter on the main master page on all sub pages -->
        </div>
      </div>
    </div>
    <div id="main">
      <cc1:CMSWebPartZone ID="zoneMain" runat="server" />  
      <!-- have a placeholder in this webpart and page template/layouts works great -->  
    </div>
  </div>
</div>
<div id="footer"></div>