0
html/css新手在這裏。如何在水平無序列表中居中列表項目？
我已經做HTML/CSS一些課程，現在我將試圖複製一些網站我喜歡測試我的知識。現在我正在盡我所能讓可汗學院的首頁（https://www.khanacademy.org），但我一直在努力。
我有一個<ul>表示頁面的頂部導航欄，現在我試圖居中他們的標誌（<div id="ka">即是導航欄的列表項內）的網頁，但使用text-align: center和margin-left: auto; & margin-right: auto沒有按」似乎什麼都不做。
這裏是我的代碼：
body {
margin: 0;
padding: 0;
background-image: url("https://cdn.kastatic.org/images/homepage/mountains-simple.svg");
background-repeat: no-repeat;
background-size: 157.75%;
background-position-x: 50.825%;
}
li {
display: inline-block;
}
.navbar {
overflow: hidden;
width: 100%;
height: 60px;
border-bottom-color: #68e2de;
border-bottom-width: 1px;
border-bottom-style: solid;
}
.navbar {
list-style: none;
}
.navbar-text {
color: white;
float: left;
font-weight: 400;
font-family: 'Montserrat', sans-serif;
font-weight: 500;
font-size: 17px;
padding: 13px 38px 0px 4px;
margin-left: -8px;
}
#ka {
display: inline-block;
}
#ka-logo {
float: left;
width: 24px;
margin-left: auto;
margin-right: auto;
}
#search-icon {
width: 32px;
margin-left: -44px;
margin-top: 8px;
}
#search-bar {
background-color: #47dcd6;
border-radius: 4px;
margin-left: 8px;
border: 1px solid #47dcd6;
padding: 12px 175px 14px 12px;
}
#expand-triangle {
font-size: 13px;
margin-left: 7px;
color: #85e8e3;
}
.bold-signika {
display: inline;
font-family: 'Signika', sans-serif;
font-size: 23px;
color: white;
font-weight: 600;
}
.signika {
display: inline;
font-family: 'Signika', sans-serif;
color: white;
font-size: 23px;
}
#sign {
float: right;
margin-right: 44px;
}<!DOCTYPE html>
<html>
<head>
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,500" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Signika:400,600" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="main.css">
</head>
<body>
<ul class="navbar">
<li class="navbar-text">Subjects<span id="expand-triangle">▼</span></li>
<li id="search-bar" class="navbar-text">Search</li>
<li><img id="search-icon" src="search.png"></li>
<li>
<div id="ka">
<img id="ka-logo" src="leaf-green.svg">
<div class="bold-signika">KHAN</div>
<div class="signika">ACADEMY</div>
</div>
</li>
<li id="sign" class="navbar-text">New user/Sign up</li>
</ul>
</body>
</html>我也似乎this question但什麼建議沒有爲我工作。
我的問題是：我怎麼中心徽標的div？
旁註：因爲我是相當新的HTML可能有很多在上面的代碼不好的做法。有關如何做更有效的事情的提示將受到高度讚賞。
導覽列UL有4個孩子的李。你想讓他們中的一個居中？你確定中心？那麼你打算如何展示其他孩子呢？您的新用戶和搜索框位於右側，而主題位於徽標左側？你不是想平均分配你的孩子嗎？ – Taxellool