我的DIV没有回应

Question

我正在尝试回复我的内容DIV，但他们没有回应。

DIV结构是这样的 -

更新：这是我的HTML和CSS

<div class="container">
    <div class="row">
        <section class="content-tertiary col-sm-4">
            my content
        </section>

        <section class="content-primary col-sm-8">
            <div id="main" class="">
                <h1><i class="icon fa fa-user fa-lg"></i><img src="img/misc/title.png" /></h1>

                <div class="sidebar"></div>
                <div class="content-box"></div>
            </div><!-- End main div -->
        </section>
    </div><!-- /.row -->
</div><!-- /.container -->

CSS

#main {
    background: #53001E;
    border-radius: 10px;
    height: 700px;

    > .sidebar {
            background: #FFFFFF;
            float: left;
            height: 300px;
            margin: 0 10px;
            min-width: 100px;
    }

    > .content-box {
        background: yellow;
        float: left;
        height: 100px;
    }
}

注意：我正在使用bootstrap，无需在移动视图中显示。

有人能告诉我这段代码有什么问题吗？

谢谢。

Answer 1

尝试

#main {
           background: #53001E;
           border-radius: 10px;
           height: 700px;
           width: 100%;
       }

sidebar {
            background: #FFFFFF;
            float: left;
            height: 300px;
            margin: 0 10px;
            width :40%
    }

.content-box {
        background: yellow;
        float: left;
        height: 100px;
        width : 60%

    }

让我知道任何帮助：）

Answer 2

如果您尝试执行这些列，则问题是您没有为每个列指定width。他们应该分享100％的可用空间。此外，margin上的10px .content-box会加起来，因此不再适合。

这将是一种干净的方式：http://jsbin.com/hozetoki/1/edit