diff --git a/spug_web/src/components/AppSelector.js b/spug_web/src/components/AppSelector.js
index 41f1ad2..6777afa 100644
--- a/spug_web/src/components/AppSelector.js
+++ b/spug_web/src/components/AppSelector.js
@@ -65,7 +65,7 @@ export default observer(function AppSelector(props) {
         <div className={styles.right}>
           <Spin spinning={fetching}>
             <div className={styles.title}>
-              <div>{lds.get(envStore.idMap, `${env_id}.name`)}</div>
+              <div className={styles.text}>{lds.get(envStore.idMap, `${env_id}.name`)}</div>
               <Input
                 allowClear
                 style={{width: 200}}
diff --git a/spug_web/src/components/index.module.less b/spug_web/src/components/index.module.less
index e30f55e..6fb7b88 100644
--- a/spug_web/src/components/index.module.less
+++ b/spug_web/src/components/index.module.less
@@ -160,12 +160,13 @@
   min-height: 500px;
 
   .left {
-    flex: 2;
+    flex: 220px;
     border-right: 1px solid #e8e8e8;
+    overflow: hidden;
   }
 
   .right {
-    flex: 7;
+    flex: 580px;
     padding: 8px 40px;
   }
 
@@ -178,10 +179,17 @@
     font-weight: 500;
     font-size: 20px;
     line-height: 28px;
+
+    .text {
+      padding-right: 12px;
+      width: 300px;
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+    }
   }
 
   .appItem {
-    width: 560px;
     display: flex;
     align-items: center;
     padding: 12px 16px;