WordPress侧边栏位于内容下方-CSS

Question

My sidebar in working with woocommerce is positioned under my content div. when i shrink the content div to 710px and try to float:right the sidebar... it doesn't want to float correctly.

SUBJECT SITE

Any help would be appreciated.

#  SIDEBAR

*************************************************************************/

#sidebar{

position:relative;

z-index:10;

width:270px;
 display:;

}

#sidebar,

#sidebar a,

#sidebar li,

#sidebar ul,

#sidebar ol{

    color:#787878;

    font-size:12px;
 display:;

}

#sidebar a:hover{

}

#sidebar ul{

    list-style:none;

    padding:0;

    margin:0;

}

    #sidebar ul li.widget{

        margin:0 0 0px 0;

        border:1px solid #fff;

        background: #e6e6e6;

    }

    #sidebar ul li.widget h2{

        font-size:18px;

        padding:13px 18px;

        color:#45494e;

        font-style:normal;

        border:1px solid #cecece;

        border-bottom:1px solid #fff;

    }

        #sidebar ul li ul{

            border:1px solid #cecece;

            border-bottom:none;

        }

            #sidebar ul li ul li{

                border-bottom:1px solid #cecece;

                padding: 10px 18px;

            }

            #sidebar ul li ul li:hover{

                border-bottom:1px solid #cecece;

                padding: 10px 18px;

                background:#eee;

            }

                #sidebar ul li ul li ul{

                    padding:0 0 0 15px;

                    border:none;

                }

                    #sidebar ul li ul li ul li{

                        border-bottom:none;

                        }

            /* TEXT WIDGET */

            #sidebar ul li div.textwidget{

                padding: 10px 18px;

                line-height:1.4em;

                border:1px solid #cecece;

            }

            /* TAG CLOUD */

            #sidebar ul li.widget_tag_cloud div{

                padding: 10px 18px;

                border:1px solid #cecece;

            }

                #sidebar ul li.widget_tag_cloud div a{

                    margin:0 10px 0 0;

                }

            /* CALENDAR */

            #sidebar ul li.widget_calendar{

                border:1px solid #fff;

            }

                #sidebar ul li.widget_calendar #calendar_wrap table#wp-calendar{

                    padding: 10px 18px;

                    width:100%;

                    border:1px solid #cecece;

                    border-top:none;

                }

                    #sidebar ul li.widget_calendar #calendar_wrap table#wp-calendar a{

                        text-decoration: underline;

                    }

                    #sidebar ul li.widget_calendar #calendar_wrap table#wp-calendar caption{

                        padding: 5px 18px 0 18px;

                        border:1px solid #cecece;

                        border-bottom:none;

                    }

                    #sidebar ul li.widget_calendar #calendar_wrap table#wp-calendar tr td#next{

                    text-align:right;

                    }

/************************************************************************

#  SIDEBAR END

Answer 1

You have two divs with id="container" that means that anything you pass to #container in your css it will only be applied to the first one. So you should take this div #wrapper-containter #wrapper #container change it's id, and then apply the width to it and then float around whatever you need.