-2
私のウェブページにはdivの間には不明な隙間があり、ナビゲーションバーの上部に空白があります。ボディのマージンとパディングを0に設定しましたが、問題はまだあります。どのようにhtml/cssのdivの間のギャップを削除するには？
私はa similar postがあることを知っていますが、その投稿に記載されている解決策はありません。また、あなたが見ることができるように、ナビゲーションバーで未知のスペースを取り除くために、負の値にマージントップを追加しましたが、非効率的な方法です。
誰でもこの問題を解決できますか？ここで
はコードです：html {
background: url(images/bg.png) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
body {
margin: 0;
border: 0;
padding: 0;
}
header {
margin-top: -17px;
background: #007400;
}
#header_inner {
width: 90%;
margin: 0 auto;
font-weight: 300;
}
header::after {
content: "";
display: table;
clear: both;
}
.menu {
float: right;
color: #eeeeee;
text-decoration: none;
text-transform: uppercase;
font-size: 15px;
}
.header2 {
margin: 0;
padding: 0;
list-style: none;
}
.header2 li {
display: inline-block;
margin-left: 40px;
padding-top: 23px;
position: relative;
}
nav a:hover {
color: #fff;
}
nav a:before {
content: "";
display: block;
height: 5px;
background-color: #fff;
position: absolute;
top: 0;
width: 0%;
transition: all ease-in-out 200ms;
}
nav a:hover::before {
width: 100%;
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="style.css">
<link href="css/jquery.bxslider.css" rel="stylesheet" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://code.jquery.com/jquery-3.1.1.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<title>Home Page</title>
</head>
<body>
<header>
<div id="header_inner">
<a href="home_page.html"></a>
<nav class="menu">
<a href="#" id="menu_icon"></a>
<ul class="header2">
<li><a href="home_page.html" class="current">Home</a></li>
<li><a href="#">Profile</a></li>
<li><a href="#">Career</a></li>
<li><a href="#">Logout</a></li>
</ul>
</nav>
</div>
</header>
<p>hello</p>
</body>
</html>
CSSを追加する必要があります。これは意味をなさないものです。 –
ブラウザにデフォルトの 'ul'スタイルを上書きします。 – Vucko
完全なCSS @MhdAlaaAlhaj – Beng970804