diff --git a/css/style.css b/css/style.css
index 877da58..5a2412b 100644
--- a/css/style.css
+++ b/css/style.css
@@ -6,7 +6,7 @@ table {
 }
 
 th, td {
-    padding: 5px 5px;
+    padding: 2px 5px;
     border: 1px solid #000;
 }
 
@@ -173,10 +173,3 @@ button:active {
     height: 40px;
     margin: 0 auto;
 }
-
-.truncate-text {
-    max-width: 100%; 
-    overflow: hidden; 
-    text-overflow: ellipsis; 
-    white-space: nowrap;
-}
diff --git a/js/index.js b/js/index.js
index a72a46a..4a5f460 100644
--- a/js/index.js
+++ b/js/index.js
@@ -16,19 +16,19 @@ document.getElementById("body").appendChild(table);
 // Creating and adding data to first row of the table
 let row_1 = document.createElement("tr");
 let heading_1 = document.createElement("th");
-heading_1.setAttribute('style', 'width: 22%;')
+heading_1.setAttribute('style', 'width: 28%;')
 let heading_2 = document.createElement("th");
-heading_2.setAttribute('style', 'width: 13%;')
+heading_2.setAttribute('style', 'width: 12%;')
 let heading_3 = document.createElement("th");
-heading_3.setAttribute('style', 'width: 13%;')
+heading_3.setAttribute('style', 'width: 12%;')
 let heading_4 = document.createElement("th");
-heading_4.setAttribute('style', 'width: 13%;')
+heading_4.setAttribute('style', 'width: 12%;')
 let heading_5 = document.createElement("th");
-heading_5.setAttribute('style', 'width: 13%;')
+heading_5.setAttribute('style', 'width: 12%;')
 let heading_6 = document.createElement("th");
-heading_6.setAttribute('style', 'width: 13%;')
+heading_6.setAttribute('style', 'width: 12%;')
 let heading_7 = document.createElement("th");
-heading_7.setAttribute('style', 'width: 13%;')
+heading_7.setAttribute('style', 'width: 12%;')
 
 let heading_1_text = document.createElement("h4");
 heading_1_text.innerHTML = "成員名稱";
@@ -99,7 +99,7 @@ axios.get("https://pcredive.ray650128.com/backend/api/record", {
             const item = data[i];
 
             if (item.record !== null) {
-                row_2_data_1.innerHTML = "<h5 class=\"truncate-text\"><a href=\"edit.html?id=" + item.record._id + "\">" + item.member.playerName + "</a><h5>";
+                row_2_data_1.innerHTML = "<h5><a href=\"edit.html?id=" + item.record._id + "\">" + item.member.playerName + "</a><h5>";
                 row_2_data_2.innerHTML = "<h5>" + item.record.record1.boss + "</h5>";
                 row_2_data_3.innerHTML = "<h5>" + item.record.record2.boss + "</h5>";
                 row_2_data_4.innerHTML = "<h5>" + item.record.record3.boss + "</h5>";
@@ -162,7 +162,7 @@ function getDate() {
                 const item = data[i];
 
                 if (item.record !== null) {
-                    row_2_data_1.innerHTML = "<h5 class=\"truncate-text\"><a href=\"edit.html?id=" + item.record._id + "\">" + item.member.playerName + "</a><h5>";
+                    row_2_data_1.innerHTML = "<h5><a href=\"edit.html?id=" + item.record._id + "\">" + item.member.playerName + "</a><h5>";
                     row_2_data_2.innerHTML = "<h5>" + item.record.record1.boss + "</h5>";
                     row_2_data_3.innerHTML = "<h5>" + item.record.record2.boss + "</h5>";
                     row_2_data_4.innerHTML = "<h5>" + item.record.record3.boss + "</h5>";