修复详情页不换行的问题

珞珈岛-项目相关文件/luojia-island/vue-frontend/src/components/PostPage.vue

@@ -206,7 +206,7 @@ watch(selectedCategory, () => {
     box-sizing: border-box;
     width: 100%;
     height: 280px;
-    max-width: 100%;
+    max-width: 475px;
     overflow: hidden;
 }
 

珞珈岛-项目相关文件/luojia-island/vue-frontend/src/views/PostDetail.vue

@@ -387,17 +387,23 @@ onUnmounted(() => {
 
 .post-title {
     font-size: 32px;
+    max-width: 70%;
     margin-bottom: 10px;
     text-align: left;
     padding-left: 5px;
+    word-break: break-all;      /* 长单词或长串自动换行 */
+    white-space: normal; 
 }
 
 .post-body {
     font-size: 16px;
+    max-width: 70%;
     line-height: 1.5;
     margin-bottom: 20px;
     text-align: left;
     padding-left: 16px;
+    word-break: break-all;      /* 长单词或长串自动换行 */
+    white-space: pre-line; 
 }
 
 .post-stats {
@@ -419,7 +425,7 @@ onUnmounted(() => {
 
 .comments-section {
     flex: 1 1 0;
-    min-height: 0;
+    min-height: 400px;
     background-color: #ffffff;
     padding: 20px;
     border: 1px solid #ccc;
@@ -473,6 +479,8 @@ onUnmounted(() => {
     font-size: 14px;
     color: #333;
     text-align: left;
+    white-space: pre-line; /* 保留换行 */
+    word-break: break-all; /* 长单词或长串自动换行 */
 }
 
 .comment-meta {