[Solved] HTML Move List To Side [closed]

by


try margin-top: 10%; instead of padding-top:500 in .server_options in css

.server_name {
  font-size: 50;
  padding-left: 5;
  z-index: -1;
  display: inline-block;
  padding-top: 0.001%;
}

.right_buttons {
  z-index: 1;
  list-style: none;
  float: right;
  vertical-align: top;
  display: inline-block;
}

.option_button {
  padding-bottom: 20;
  font-size: 30;
  text-align: center;
  text-decoration: unset;
  list-style: none;
  font-weight: bold;
}

.option_text {
  text-decoration: none;
  text-align: center;
}

.server_options_button {
  background-color: #555555;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
}

.server_options {
  float: left;
  margin-top: 10%;
  list-style: none;
  display: inline-block;
}
  <h1 class="server_name">Server Name</h1>
  <ul class="right_buttons">
    <li class="option_button"><a href="#" class="option_text">Change Server</a></li>
    <li class="option_button"><a href="#" class="option_text">Log Out</a></li>
  </ul>

  <ul class="server_options">
    <li class="server_options_button_ph"><button class="server_options_button">Moderation</button></li>
    <li class="server_options_button_ph"><button class="server_options_button">Music</button></li>
    <li class="server_options_button_ph"><button class="server_options_button">Minecraft</button></li>
  </ul>

1

solved HTML Move List To Side [closed]