css - 右浮动宽度 100% 不起作用

Question

这是我的 fiddle :http://jsfiddle.net/kasper90/GB7bs/6/ 我希望主 div 尽可能大，位于切换 div 的右侧。 我怎样才能做到这一点 ？非常感谢任何帮助:)

HTML:

<div id="toggle"></div>
<script>
$( document ).click(function() {
$( "#toggle" ).toggle( "slide",{ direction: "left" }, 1000 );
});
</script>
<div id="main"><object data="http://euclidthegame.com/mathexchange/5.svg" type="image/svg+xml"></object></div>

CSS:

 #toggle {
    float: left;
    width: 100px;
    height: 800px;
    border: 1px solid black;
    background: #ccc;
}
#main {
    float: right ;
    width: 100%;
    height:800px;
    border: 1px solid black;
}

Answer 1

你应该在主容器中使用 width:auto 并移除 floating:right。

这应该是你的 CSS:

#toggle {
    float: left;
    width: 100px;
    height: 800px;
    border: 1px solid black;
    background: #ccc;
}
#main {
    height:800px;
    border: 1px solid black;
    width: auto;
}

问候