Bootstrap 3.3 ipad resolution hitting col-xs rather than col-sm

HTML & CSS
1

The website i am working on is using sass bootstrap 3.3.5 via bower. Now, when i do dev tools in FF and chrome to look at the design… when i make change to col-xs only then the change gets applied to ipad 768X1024.

col-sm should be responsible for ipad and not col-xs. I can’t seem to find where the disconnect is? Could any one over here kick me in the right direction? Sorry, there isn’t enough to go with… checking with the community if some one else has gotten into this issue…

I created a quick test and this works normally with col-sm responsible for ipad.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html >
    <head id="head">
        <title>Bootstrap 3 test</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <!--3.3-->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
        
    </head>

    <body >
        
        <div class="container">
            <h1>Testing bootstrap 3</h1>
            <div class="row">
                <div class="col-xs-9 col-sm-8">
                    <p style="background-color: yellow;">This is some text which needs to behave properly</p>
                </div>
            </div>
        </div>

    </body>
</html>
2

It looks like an issue with the bootstrap version that comes with bower. I have created a test page by picking the bootstrap min css and js, col-xs is handling the ipad and not col-sm.

3

We’d need to see the site with the problem to debug properly I’m afraid. Sounds like a conflict somewhere but without using devtools on a live version it will be difficult to pinpoint.

4

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.