CSS Twentyeleven / Sidebar has to be changed IN the CSS Stylesheet. Sidebar on the left side

Question

I have to change my wordpress look. The sidebar should be placed on the left side. I was already looking for solutions, but the piece of codes I found didn't fit into mine. I dont know where I have to change it. I know I can change it in the Options, but I need to change it IN the CSS Stylesheet. Thanks for your help !

Twenty Eleven/twentyeleven.44: Stylesheet (style.css)

body {
    padding: 0 2em;
}
#page {
    margin: 2em auto;
    max-width: 1000px;
}
#branding hgroup {
   margin: 0 7.6%;
}
#access div {
    margin: 0 7.6%;
}
#primary {
    float: left;
    margin: 0 -26.4% 0 0;
    width: 100%;
}
#content {
    margin: 0 34% 0 7.6%;
    width: 58.4%;
}
#secondary {
    float: right;
    margin-right: 7.6%;
    width: 18.8%;
}


/* Singular */
.singular #primary {
    margin: 0;
}
.singular #content,
.left-sidebar.singular #content {
    margin: 0 7.6%;
    position: relative;
    width: auto;
}
.singular .entry-header,
.singular .entry-content,
.singular footer.entry-meta,
.singular #comments-title {
    margin: 0 auto;
    width: 68.9%;
}


/* Attachments */
.singular .image-attachment .entry-content {
    margin: 0 auto;
    width: auto;
}
.singular .image-attachment .entry-description {
    margin: 0 auto;
    width: 68.9%;
}


/* Showcase */
.page-template-showcase-php #primary,
.left-sidebar.page-template-showcase-php #primary {
    margin: 0;
}
.page-template-showcase-php #content,
.left-sidebar.page-template-showcase-php #content {
    margin: 0 7.6%;
    width: auto;
}
.page-template-showcase-php section.recent-posts {
    float: right;
    margin: 0 0 0 31%;
    width: 69%;
}
.page-template-showcase-php #main .widget-area {
    float: left;
    margin: 0 -22.15% 0 0;
    width: 22.15%;
}


/* error404 */
.error404 #primary {
    float: none;
    margin: 0;
}
.error404 #primary #content {
    margin: 0 7.6%;
    width: auto;
}


/* Alignment */
.alignleft {
    display: inline;
    float: left;
    margin-right: 1.625em;
}
.alignright {
    display: inline;
    float: right;
    margin-left: 1.625em;
}
.aligncenter {
    clear: both;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/* Right Content */
.left-sidebar #primary {
    float: left;
    margin: 0 0 0 -26.4%;
    width: 100%;
}
.left-sidebar #content {
    margin: 0 7.6% 0 34%;
    width: 58.4%;
}
.left-sidebar #secondary {
    float: right;
    margin-left: 7.6%;
    margin-right: 0;
    width: 18.8%;
}

Answer 1

Try to edit your style.css in the following way:

Find this: #secondary

And edit it in this way:

#secondary {
    float: left;
    margin: 28px;
    width: 22.8%;
}

And then find this: #primary

And edit it in this way:

#primary {
    float: right;
    margin: 0 -55px;
    width: 80%;
}

By doing this, your sidebar will move to the right. You can keep working on these css properties till you get your perfect layout.

Note that this works for TwentyEleven theme.

Answer 2

This should do it:

#primary {
    float: right;
    margin: 0 -26.4% 0 0;
    width: 100%;
}

#secondary {
    float: left;
    margin-right: 7.6%;
    width: 18.8%; 
}