Question

在我的桌面版本上，我使用float来设置彼此相邻的两个div。在我的移动版本中，其中一个div是不可见的，所以我想撤消那个拥有它的浮动。

你如何撤消＆＃39;浮在媒体查询？我试过浮动：没有;并清楚：两者;但这没有用。这是我的css代码;

             .float {
                      float:left;
                      padding-right:10px;
                  }

                @media (max-width: 900px) {
                .float {
                        float:none !important;
                            text-align:center;

                    }
                 }

这是我的HTML代码;

<div class="row">
                <div class="col-md-4 col-lg-4 col-sm-4"></div>
                <div class="col-xs-12 col-sm-12 col-md-7 col-lg-7">
                    <img src="assets/images/logo.png" class="float">
                    <h1 style="padding-top:70px; padding-left:10px;" class="logo title">LIPSUM DOLOR</h1>
                    <h2 class="sub logo">Lorem ipsum dolor</h2>
                </div><!-- end col -->
</div><!-- end row -->

现在我使用Twitter的引导程序，这就是我使用列和行的原因。在xs屏幕（移动设备）上看不到宽度为4的第一列，因此不应该造成任何麻烦。它也没有自定义样式。

Answer 1

您的媒体查询代码错误。它应该是

.row{
    text-align:center;
}
.float {
    float:left;
    padding-right:10px;
}

@media only screen and (max-width: 900px) {
    .float {
        float:none;
    }
}

撤消移动屏幕的浮动

1 个答案: