固定大小的bootstrap容器

Question

我正在尝试为所有大小的窗口制作容器固定大小750px。 这是HTML：

<div class="container">
        <div class="thumbnail" >
            ..........<br/>
            ..........
        </div>
</div>    

和自定义CSS：

   @media (min-width: 1200px) {
    .container {
        width: 750px;
    }

    @media (min-width: 992px) {
    .container {
        width: 750px;
    }

    @media (min-width: 768px) {
    .container {
        width: 750px;
    }

但问题是当我将窗口从大到小调整大小时，thumbnail的大小会变大一点，然后反转到其初始大小。

这是一个小提琴http://jsfiddle.net/Wy22s/718/。您只需调整浏览器窗口的大小或向内滑动窗口，然后向右移动即可重现此行为。

我尝试使用row类添加另一个div。尝试与col-sm，col-md等组合，但我无法达到预期的行为。如何修复此问题，以使容器/缩略图大小保持不变？

Answer 1

你忘了关闭@media括号。

    @media (min-width: 1200px) {
    .container {
        width: 750px !important;
    }
}
    @media (min-width: 992px) {
    .container {
        width: 750px !important;
    }
}
    @media (min-width: 768px) {
    .container {
         width: 750px !important;
    }
}


.container{ width: 750px !important;}
.thumbnail{ width: 750px !important;}