【类 型】：fix 手机竖屏 日志超出宽度 不显示

【原  因】：css样式导致
【过  程】：display: inline-block;并设置一个最大宽度 超出省略号代替
【影  响】：

src/views/layout/components/BlogBox.vue

@@ -2,10 +2,10 @@
   <div class="fixed-bottom p-l-5" :class="maxWidth">
     <el-button @click="handleOpenBlog" class="l p-3" type="text" size="mini" icon="iconfont icon-chuangkoufangda"
       circle></el-button>
-    <div class="l p-l-10" v-if="newLog">
+    <div class="l p-l-10 flex" v-if="newLog">
       <span class="l m-t-5 m-r-5 logDot" :style="{ background: newLog.color }"></span>
       <span>{{ newLog.timestamp | parseTime('{h}:{i}:{s}') }}</span>
-      <span class="m-l-10">{{ newLog.content }}</span>
+      <span class="content m-l-10">{{ newLog.content }}</span>
     </div>
     <el-drawer :modal-append-to-body="false" :visible.sync="drawer" direction="btt" size="50%">
       <template slot="title">
@@ -99,4 +99,15 @@ export default {
   overflow: hidden;
   display: block;
 }
+
+.timestamp,
+.content {
+  display: inline-block;
+  /* 确保元素可以应用宽度 */
+  max-width: 60vw;
+  /* 根据需要设置宽度 */
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
 </style>