flex布局清除

components/mobile/MobileHeader.vue

@@ -253,16 +253,12 @@
     width:100%;
     height:.88rem;
     line-height: .88rem;
-    display:flex;
-    justify-content:space-around;
-    align-items:center;
     border-bottom:.02rem solid #ccc;
     background: #3e82f5;
     padding:0 .2rem 0 .1rem;
     color:#fff;
   }
   .mobile-header p{
-    width: 5.2rem;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;

components/mobile/brand/BrandCenter.vue

@@ -171,8 +171,6 @@
           }
         }
         .brand-items {
-          flex-wrap: wrap;
-          display: flex;
           overflow: hidden;
           margin-bottom: .2rem;
           a {

components/mobile/search/MainSearch.vue

@@ -145,8 +145,7 @@
       height: .71rem;
       background: #4391f7;
       padding-left: .5rem;
-      display: flex;
-      align-items: center;
+      line-height: .71rem;
       input {
         width: 4.78rem;
         height: .54rem;

pages/mobile/search/_keycode.vue

@@ -201,15 +201,16 @@
       }
     }
     .search-item{
-      justify-content: space-around;
       text-align: center;
-      display:flex;
       span{
         display:inline-block;
         width:1.41rem;
         line-height: .76rem;
         font-size:.32rem;
         color:#666;
+        &:first-child {
+          margin-right: 2rem;
+        }
       }
       span.active{
         color:#3976f4;
@@ -239,14 +240,13 @@
         }
       }
       .brand-list-item{
-        flex-wrap: wrap;
-        display:inline-flex;
         overflow: hidden;
-        margin: 0 .2rem;
+        margin: .1rem .2rem 0;
         text-align: center;
         >div {
           display: inline-block;
           margin-right: .14rem;
+          float: left;
           &:nth-child(4n) {
             margin-right: 0;
           }
@@ -278,6 +278,7 @@
         font-size:.32rem;
         line-height: .6rem;
         margin:0 0 0 3.97rem;
+        position: relative;
         img {
           position: absolute;
           left: -132px;
@@ -285,15 +286,13 @@
         }
       }
       .brand-list{
-        display:flex;
-        justify-content: space-between;
-        align-items: center;
         margin:0 .15rem;
         .list-left{
           border:.02rem solid #418ef7;
           border-radius: .05rem;
           width:2.03rem;
           height:1.73rem;
+          display: inline-block;
           img{
             display:block;
             width:100%;
@@ -314,6 +313,7 @@
           font-size:.28rem;
           line-height: .4rem;
           padding:.12rem .46rem 0 .05rem;
+          float: right;
         }
       }
     }

pages/mobile/shop/index.vue

@@ -160,11 +160,9 @@
     min-height: 10rem;
     background: #e2e4e6;
   .shop-top{
-    display:inline-flex;
-    justify-content: space-between;
-    align-items: center;
     width:100%;
     height:1.14rem;
+    line-height: 1.14rem;
     padding:0 .3rem;
     position:relative;
     background:#fff;
@@ -186,6 +184,7 @@
     p{
       font-size:.24rem;
       color:#000;
+      display: inline-block;
       i{
         font-size: .53rem;
         color:#418ef7;
@@ -199,6 +198,7 @@
     >span{
       font-size:.28rem;
       color:#53a0f7;
+      float: right;
     }
   }
   .shop-list {
@@ -217,12 +217,12 @@
     .list-item{
       width:6.77rem;
       margin-left:.39rem;
-      justify-content: space-around;
-      display:inline-flex;
       .item-img{
         position:relative;
         width:2.42rem;
         height:1.69rem;
+        display: inline-block;
+        vertical-align: middle;
         i{
           display:block;
           position:absolute;
@@ -241,6 +241,9 @@
         width:3.95rem;
         padding:.18rem 0;
         position:relative;
+        display: inline-block;
+        vertical-align: middle;
+        margin-left: .2rem;
         p{
           font-size:.28rem;
           line-height: .67rem;

pages/mobile/user/index.vue

@@ -205,10 +205,8 @@
       }
     }
     .user-name{
-      padding:.14rem 0 .09rem .34rem;
+      padding:.14rem 0 .2rem .34rem;
       background:#fff;
-      display:flex;
-      align-items: center;
       width:100%;
       position:relative;
       .supdown{
@@ -234,10 +232,12 @@
         height:1.25rem;
         border:.04rem solid #c5dbfc;
         border-radius: .05rem;
+        vertical-align: middle;
       }
       .user-info {
         margin-left:.25rem;
         display: inline-block;
+        vertical-align: middle;
         p{
           font-size:.3rem;
           margin:0;
@@ -262,7 +262,7 @@
     }
     .shop-list {
       background:#fff;
-      margin-top:.1rem;
+      border-bottom: .1rem solid #dfe2e4;
       padding-bottom:.28rem;
       h3{
         font-size:.32rem;
@@ -274,10 +274,10 @@
       .list-item{
         width:6.77rem;
         margin-left:.39rem;
-        justify-content: space-around;
-        display:inline-flex;
         .item-img{
           width:2.42rem;
+          vertical-align: middle;
+          display: inline-block;
           i{
             display:block;
             position:absolute;
@@ -296,6 +296,9 @@
           width:3.95rem;
           padding:.18rem 0;
           position:relative;
+          display: inline-block;
+          vertical-align: middle;
+          margin-left: .26rem;
           p{
             font-size:.28rem;
             line-height: .67rem;
@@ -322,9 +325,12 @@
     .detail-brand{
       background: #fff;
       width:100%;
-      margin-top:.1rem;
       min-height:1.5rem;
       padding:.2rem 0;
+      border-bottom: .1rem solid #dfe2e4;
+      &:nth-child(1) {
+        margin-top:.1rem;
+      }
       .brand-item{
         width:7rem;
         margin:0 auto;
@@ -340,7 +346,6 @@
           line-height:.4rem;
           color:#333;
           margin:0;
-          span{}
         }
         i{
           display:block;
@@ -357,8 +362,6 @@
     }
     .collect-list-type {
       background: #fff;
-      margin-top: .1rem;
-      margin-bottom: -.11rem;
       border-bottom: .02rem solid #acacac;
       p {
         font-size: .32rem;