diff --git a/pages/plugins/video/components/search.vue b/pages/plugins/video/components/search.vue
index c0f0a6f5..5f981b41 100644
--- a/pages/plugins/video/components/search.vue
+++ b/pages/plugins/video/components/search.vue
@@ -1,12 +1,12 @@
 <template> 
-    <view class="search-bar pr">
+    <view class="search-bar pr flex-row align-c" :style="search_width_style">
         <view v-if="propIsDisabled" class="search-mask" @tap="disabled_search"></view>
         <view class="search-iconfont-container">
             <iconfont name="icon-search-fine"></iconfont>
         </view>
-        <input type="text" v-model="search_keywords" :adjust-position="false" :placeholder="$t('search.search.ic9b89')" @input="handle_search" @confirm="perform_search" />
+        <input class="flex-1" type="text" v-model="search_keywords" :adjust-position="false" :placeholder="$t('search.search.ic9b89')" @input="handle_search" @confirm="perform_search" />
         <view class="search-line"></view>
-        <view class="search-button" @tap="perform_search">{{$t('common.search')}}</view>
+        <text class="search-button" @tap="perform_search">{{$t('common.search')}}</text>
     </view>
 </template>
 
@@ -26,11 +26,16 @@ export default {
         propIsDisabled: {
             type: Boolean,
             default: false
+        },
+        propWidth: {
+            type: Number,
+            default: 0
         }
     },
     data() {
         return {
-            search_keywords: ''
+            search_keywords: '',
+            search_width_style: '',
         }
     },
     watch: {
@@ -39,6 +44,15 @@ export default {
                 this.search_keywords = newVal;
             },
             immediate: true
+        },
+        propWidth: {
+            handler(newVal, oldVal) {
+                console.log(newVal, oldVal);
+                if (newVal !== oldVal && newVal > 0) {
+                    this.search_width_style = 'width:' + newVal - 40 + 'px;';
+                }
+            },
+            immediate: true
         }
     },
     created() {
@@ -66,44 +80,46 @@ export default {
 /* 搜索框 */
 .search-bar {
 	display: flex;
+    flex-direction: row;
 	align-items: center;
 	background: rgba(255,255,255,0.5);
 	border-radius: 38rpx;
 	border: 2rpx solid #313131;
-    height: 100%;
+    height: 80rpx;
 	margin: 0 24rpx;
-	.search-iconfont-container {
-		padding: 16rpx 30rpx;
-		padding-right: 20rpx;
-	}
-	input {
-		flex: 1;
-		height: 100%;
-		padding: 16rpx 0;
-		box-sizing: border-box;
-        background: transparent;
-	}
-	.search-line {
-		width: 2rpx;
-		height: 100%;
-		padding: 16rpx 0;
-		margin-left: 20rpx;
-		background-color: #eee;
-	}
-	.search-button { 
-		font-weight: 500;
-		font-size: 28rpx;
-		color: #333333;
-		line-height: 20px;
-		padding: 16rpx 30rpx 16rpx 20rpx;
-	}
-    .search-mask {
-        position: absolute;
-        top: 0;
-        left: 0;
-        width: 100%;
-        height: 100%;
-        z-index: 99;
-    }
+}
+.search-iconfont-container {
+    padding: 16rpx 30rpx;
+    padding-right: 20rpx;
+}
+input {
+    flex: 1;
+    height: 76rpx;
+    padding: 16rpx 0;
+    box-sizing: border-box;
+    background: transparent;
+}
+.search-line {
+    width: 2rpx;
+    height: 44rpx;
+    margin: 16rpx 0;
+    margin-left: 20rpx;
+    box-sizing: border-box;
+    background-color: #eee;
+}
+.search-button { 
+    font-weight: 500;
+    font-size: 28rpx;
+    color: #333333;
+    line-height: 20px;
+    padding: 16rpx 30rpx 16rpx 20rpx;
+}
+.search-mask {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 80rpx;
+    z-index: 99;
 }
 </style>
\ No newline at end of file
diff --git a/pages/plugins/video/detail/detail.nvue b/pages/plugins/video/detail/detail.nvue
index bd3b9ad5..8dd37184 100644
--- a/pages/plugins/video/detail/detail.nvue
+++ b/pages/plugins/video/detail/detail.nvue
@@ -65,21 +65,20 @@
                         </template>
                     </view>
                 </swiper-item>
-            </swiper>
-            
-            <!-- 搜索框 -->
-            <view v-if="!show_comment_modal" class="header-top" :style="top_content_style + menu_button_info + ' width: ' + windowWidth + 'px'">
-                <view id="search-height" class="flex-row align-c">
-                    <!-- 支付宝小程序自带返回按钮，这里就不给返回按钮了，这里给留出一点空间就行 -->
-                    <!-- #ifndef MP-ALIPAY -->
-                    <view class="cp" @tap="handle_back">
-                        <u-icon propName="arrow-left" propSize="36rpx" propColor="#333" class="mr-10"></u-icon>
-                    </view>
-                    <!-- #endif -->
-                    <view class="wh-auto ht-auto" :style="header_padding_left">
-                        <search-component propIsDisabled @disabledSearch="handle_search" :propsWidth="windowWidth" />
-                    </view>
-                </view>
+            </swiper>
+            <!-- 搜索框 -->
+            <view v-if="!show_comment_modal" class="header-top" :style="top_content_style + menu_button_info + ' width: ' + windowWidth + 'px;'">
+                <view id="search-height" class="flex-row align-c">
+                    <!-- 支付宝小程序自带返回按钮，这里就不给返回按钮了，这里给留出一点空间就行 -->
+                    <!-- #ifndef MP-ALIPAY -->
+                    <view class="cp" @tap="handle_back">
+                        <u-icon propName="arrow-left" propSize="36rpx" propColor="#333" class="mr-10"></u-icon>
+                    </view>
+                    <!-- #endif -->
+                    <view class="flex-1" :style="header_padding_left">
+                        <search-component propIsDisabled @disabledSearch="handle_search" :propsWidth="windowWidth" />
+                    </view>
+                </view>
             </view>
         </view>
 		<template v-else>
@@ -469,7 +468,7 @@
             init() { 
                 try {
                     // 小程序下，获取小程序胶囊的宽度
-                    let menu_button_info = 'max-width:100%';
+                    let menu_button_info = `max-width:${ this.windowWidth }px;`;
                     // #ifndef MP-TOUTIAO
                         // #ifdef MP
                         // 判断是否有胶囊
@@ -488,8 +487,10 @@
                     // #endif
                     this.header_padding_left = padding_left;
                     this.menu_button_info = menu_button_info;
-                    this.current_video_id = isEmpty(this.current_video_id) ? this.params.id : this.current_video_id;
-
+                    this.current_video_id = isEmpty(this.current_video_id) ? this.params.id : this.current_video_id;
+                    // top_content_style 为undefined， 在这里重新赋值
+                    console.log(this.top_content_style);
+                    this.top_content_style = 'padding-top:' + bar_height + 'px;padding-bottom:10px;';
                     this.get_video_detail(this.current_video_id);
                 } catch (error) {
                     console.error('init error:', error);
@@ -2200,13 +2201,13 @@
     }
     /* 搜索 */
     .header-top {
-        padding-left: 12px;
+        padding-left: 24rpx;
         box-sizing: border-box;
         position: absolute;
         top: 0;
         left: 0;
         z-index: 9;
-        width: 100%;
+        // width: 100%;
     }
     .header-top ::v-deep .search-bar {
         background:#D8D8D8;