#record { } #record .header { position: fixed; top: 0; left: 0; right: 0; width: 100%; height: .4rem; line-height: .4rem; text-align: center; z-index: 10; } .header .left { position: absolute; top: 50%; transform: translate(0, -55%); left: .12rem; width: .19rem; height: .19rem; vertical-align: middle; } .header .set{ position: absolute; right: .14rem; top: 50%; transform: translate(0, -55%); width: .19rem; height: .19rem; vertical-align: middle; } .header div { font-size: .16rem; color: #000000; } .detial { padding-top: .45rem; } .info { width: 3.11rem; margin: 0 auto; height: .64rem; padding: .1rem; background: rgba(255,255,255,1); box-shadow: 0px 0px 4px 0px rgba(214,214,214,1); border-radius: .06rem; position: relative; margin-bottom: .14rem; } .info .title { font-size: .14rem; font-weight: bold; color: #424242; } .info .time { margin-top: .05rem; color: #7F7F7F; font-size: .12rem; font-weight:400; line-height: .2rem; } .info .status { position: absolute; right: 0; top: 50%; transform: translate(0, -55%); vertical-align: middle; font-size: .12rem; } .info .status text { vertical-align: middle; color: #D6D6D6; } .info .status .arrow_text { color: #EA5E5E; } .info .status .arrow { vertical-align: text-top; width: .19rem; height: .19rem; display: inline; } body { -webkit-text-size-adjust: 100% ; }