Closed. This question needs debugging details . It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem . This will help others answer the question.
Closed 1 hour ago.
Improve this question
I want to center the "Name" and put the other ones on the left and right side. how it isHow i want it this is for flexbox. HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<nav class="navbar">
<div class="brand-title"><a href="">Name</a></div>
<div class="navbar-links">
<ul>
<li>
<a href="" class="">Trade</a>
</li>
<li>
<a href="">RankUp</a>
</li>
</ul>
</div>
</nav>
<script src="script.js"></script>
</body>
</html>CSS
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
.navbar {
display: flex;
justify-content:space-between;
align-items: center;
background-color: rgb(55, 48, 46);
color: white;
text-decoration: none;
}
.brand-title {
font-size: 1.5rem;
padding: 1rem;
}
.navbar-links ul {
float: left;
margin: 0;
padding: 0;
display: flex;
}
.navbar-links li {
list-style: none;
}
.navbar-links li a {
text-decoration: none;
color: white;
padding: 1rem;
display: block;
}
a {
color: white;
text-decoration: none;
}
.navbar-links li:hover {
background-color: rgb(92, 84, 81);
color: white;
}
1条答案
按热度按时间j8ag8udp1#
您需要使用ordercss属性，以便在中心设置名称