Question

bootstrap col-sm-offset-1正在应用于我的md大小的列。有没有其他人有这个问题，如果有的话，你找到了解决方法。问题出在第二组列上。 col-sm-offset-1不应仅适用于col-md-5而只适用于col-sm-10，但它是。

<div class="row">
    <div class="col-md-5 col-md-offset-1  col-sm-5 col-sm-offset-1">
        <h3>Welcome to Parking Services Customer Support</h3>
        <p>We promise to provide you with the highest level of customer service everyday, our goal is to better understand the needs of our customers and quickly respond to your questions and comments. Contact us anytime; we look forward to hearing from
            you.
        </p>
        <p>We value our customers and provide the following value-added support:</p>
        <ul>
            <li>Experienced, trained, easy to reach support staff.</li>
            <li>Courteous and immediate response to all inquires.</li>
            <li>Convenient answers to questions via <a href="FAQ.aspx">Frequently Asked Questions</a>.</li>
        </ul>
    </div>
    <div class="col-md-5 col-sm-10 col-sm-offset-1">
        <h3>How to Contact UGA Parking Services</h3>
        <p>For inquiries about technical assistance, your My Parking Account, or our services not covered in the <a href="FAQ.aspx">FAQ</a>, contact us from 7:30am to 5:00pm, Monday to Friday.</p>
        <p class="text-center"> <a href="FeedbackForm.aspx" target="_blank" class="btn btn-primary">Feedback Form</a>
            <a href="AnonymousForm.aspx" target="_blank" class="btn btn-primary">Anonymous Form</a>
            <a href="mailto:%20parking@uga.edu" class="btn btn-primary">E-mail</a>
        </p>
        <br />
        <div class="col-md-6 col-sm-6">
            <p>Phone:</p>
        </div>
        <div class="col-md-6 col-sm-6">
            <p>
                Mailing Address:
                <br />address

            </p>
        </div>
    </div>
</div>

Answer 1

也许你没有理解这个sm，md等代表什么。它们表明它们应该保持网格的大小。如果你使用sm它将保持一个网格，直到网格比786px更小。如果你选择md它将是一个网格，直到窗口的宽度大于或等于992px。

因此，如果您应用col-sm-offset-1，则偏移将保持不变，直到网格小于990px。

您必须将自己的选择器编写为将此偏移量应用于小于990px的网格中的行。 E.g。

@media (max-width: 990px){
   .only-sm-offset-1 {
       margin-left: 8.333333333333332%;
    }
}

示例：http://jsfiddle.net/3tX8R/1/

Bootstrap 3.1.1 col-sm-offset-1应用于col-md-5

1 个答案: