.notice-container { max-height: 600px; overflow-y: scroll; border: 2px solid #2a6cc4; padding: 10px; border-radius: 8px; } .notice-search-box { margin-bottom: 10px; } .notice-search-box input { width: 100%; padding: 10px; border: 2px solid #2a6cc4; border-radius: 5px; font-size: 16px; } .notice-table { width: 100%; border-collapse: collapse; font-family: Arial, sans-serif; } .notice-table th { background: #2a6cc4; color:green; padding: 12px; font-size: 16px; text-align: left; position: sticky; top: 0; } .notice-table td { border-bottom: 1px solid #ddd; padding: 12px; font-size: 15px; } .notice-table tr:nth-child(even) { background: #f7faff; } .notice-table tr:hover { background: #e4efff; } .action-btn { background: #007bff; color: white !important; padding: 6px 14px; border-radius: 5px; text-decoration: none; font-size: 14px; cursor: pointer; display: inline-block; } .action-btn:hover { background: #0056b3; } function searchNotice() { let input = document.getElementById("noticeSearch"); let filter = input.value.toLowerCase(); let table = document.getElementById("noticeTable"); let tr = table.getElementsByTagName("tr"); for (let i = 1; i < tr.length; i++) { let found = false; let td = tr[i].getElementsByTagName("td"); for (let j = 0; j -1) { found = true; break; } } } tr[i].style.display = found ? "" : "none"; } }