/* Reset default margin and padding */ body, ul { margin: 0; padding: 0; } body { font-family: Arial, sans-serif; display: flex; } .menu { width: 200px; /* Adjust width as needed */ background-color: black; color: white; height: 100vh; /* Full viewport height */ position: fixed; top: 0; left: 0; display: flex; flex-direction: column; } .menu ul { list-style: none; padding: 0; } .menu li { border-bottom: 1px solid white; } .menu a { display: block; padding: 15px; color: white; text-decoration: none; transition: background-color 0.3s ease; } .menu a:hover { background-color: grey; /* Highlight color on hover */ } .content { margin-left: 200px; /* Same as menu width */ padding: 20px; }