CSS Ride SideBar needs to Stay Up top

Question

My right side bar isn't staying on top.

These are the two pages for example. www.cafecartel.com

and www.cafecartel.com.index2.php

Currently the way the site is written, the right side bar must be placed like this:

body id="Support" div id="container1" div id="container2"

div id="header"
 ?php include("inc/header.inc"); ?
  h1 Point of Sale for Restaurants, POS Retail and Inventory by Cafe Cartel/h1
/div

div id="wrapper" div id="content"

div id="sidebar"
 ?php include("inc/sidebar_justafew.inc"); ?
 ?php include("inc/sidebar_whouses.inc"); ?
/div

div id="maincontent"

---

What i want is to be able place the Sidebar Beneath the Main Content. For SEO.

This is the CSS for the side bar:

sidebar {

float: right;
    position: relative;
    left: 178px;
    width: 166px;
    padding-top: 5px;
margin-left: -165px;
margin-bottom: 50px;
    line-height: 1.4em;
    voice-family: "\"}\"";
    voice-family: inherit;
    width: 165px;
    }

All help is appreciated. Thank you

Answer 1

Hello-- I'm having trouble fully understanding the question, so my apologies in advance if I misunderstood, but to have the sidebar appear next to the content and have content appear above the sidebar in HTML, you could float the #maincontent div left, and the #sidebar div right.

#content { clear: both; }

#maincontent { float: left; }

#sidebar { float: right; }

You'll need to clear the floats after, too, so I added the clear: both on the content div.

Hope that helps!

Answer 2

cc_layout.css line: 63

#maincontent {
    margin:0;
    padding:0;
    position:relative;
    width:97%;
    float: left;
}

@Carl, the difference between the two pages (old and new) is that he has placed the sidebar HTML below the maincontent (new) compared to above (old).