0
私はヘッダーにFacebookのイメージを追加しようとしていますが、何かが画面の右端にFacebookのイメージを押しています。それは次のようになります。 
任意のアイデア理由：代わりに、イメージは正しい場所にありませんシンプルなHTML CSS
をしかし、私の現在のCSSを使用した、それはこのように表示されますか？私はまだ適切な技術を学んでいます。私はPhotoshopのデザインから多くのCSSをコピーしました。
@charset "utf-8";
/* CSS Document */
.aseimg {
background-image: url("ASE_large.png");
position: absolute;
left: 721px;
top: 77px;
width: 173px;
height: 65px;
z-index: 61;
}
.NADAlogo {
background-image: url("NADAlogo.png");
position: absolute;
left: 916px;
top: 77px;
width: 245px;
height: 65px;
z-index: 62;
}
._5_Stars {
background-image: url("5 Stars.png");
position: absolute;
left: 1453px;
top: 97px;
width: 139px;
height: 26px;
z-index: 59;
}
.if_facebook_834722 {
background-image: url("if_facebook_834722.png");
position: relative;
left: 1183px;
top: 88px;
width: 45px;
height: 44px;
z-index: 65;
}
nav {
width: 100%;
background: #193441;
border: 1px solid #465d65;
border-right: none;
position: absolute;
left: -4px;
top: 146px;
z-index: 66;
}
nav ul {
overflow: hidden;
margin: 0;
padding: 0;
}
nav ul li {
list-style: none;
float: left;
text-align: center;
border-left: 1px solid #465d65;
border-right: 1px solid #ccc;
width: 25%;
/* fallback for non-calc() browsers */
width: calc(100%/4);
box-sizing: border-box;
}
nav ul li a:hover {
background: -webkit-linear-gradient(rgba(25, 25, 25, 1), rgba(126, 158, 173, 0.5), rgba(255, 255, 255, 0.5));
/* For Safari 5.1 to 6.0 */
background: -o-linear-gradient(rgba(25, 25, 25, 1), rgba(126, 158, 173, 0.5), rgba(255, 255, 255, 0.5));
/* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(rgba(25, 25, 25, 1), rgba(126, 158, 173, 0.5), rgba(255, 255, 255, 0.5));
/* For Firefox 3.6 to 15 */
background: linear-gradient(rgba(25, 25, 25, 1), rgba(126, 158, 173, 0.5), rgba(255, 255, 255, 0.5));
/* Standard syntax (must be last)*/
}
nav ul li a:active {
background: -webkit-linear-gradient(top, rgba(255, 0, 0, 0), rgba(255, 0, 0, 1));
/* For Safari 5.1 to 6.0 */
background: -o-linear-gradient(top, rgba(255, 0, 0, 0), rgba(255, 0, 0, 1));
/* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(top, rgba(255, 0, 0, 0), rgba(255, 0, 0, 1));
/* For Firefox 3.6 to 15 */
background: linear-gradient(to bottom, rgba(255, 0, 0, 0), rgba(255, 0, 0, 1));
/* Standard syntax (must be last) */
}
nav ul li:first-child {
border-left: none;
}
nav ul li a {
display: block;
text-decoration: none;
color: #ffffff;
font-family: "Helvetica Neue", Helvetica, Arial, "sans-serif";
padding: 10px 0;
}<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HighTech Auto Sales</title>
<link href="mainCSS.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="header">
<a itemprop="url" class="aselink" href="http://www.ase.com/Landing-Pages/Car-Owners/Find-a-Repair-Shop/Shop-Locator.aspx?Address=19111&d=75&sc=us">
<img class="aseimg" src="../Index%20Images/ASE_large.png"></a>
<a itemprop="url" class="NADAlogolink" href="http://www.niada.com/member_directory.php?te_mode=map_view">
<img class="NADAlogo" src="../Index%20Images/NADAlogo.png"></a>
<a itemprop="url" class="if_facebook_834722">
<img class="if_facebook_834722" src="../Index%20Images/if_facebook_834722.png"></a>
<img class="_5_Stars" src="../Index Images/5stars_small.png">
</div>
<nav>
<ul>
<li><a href="inventory.html">Our Inventory</a></li>
<li><a href="services.html">Superior Services</a></li>
<li><a href="blog.html">HighTech Blog</a></li>
<li><a href="contact.html">Contact & Location</a></li>
</ul>
</nav>
</body>
</html>
こんにちは。コードに画像の相対パス**を追加しました。オンラインで画像をアップロードし、画像をオンライン版にリンクするコードを更新してください。私たちはあなたのローカルイメージを見ることができず、オンラインコピーにリンクすることで私たちはそれを見ることができます。この問題を解決するために問題のあるイメージを見ることができることが重要です:) –
このクラス '.if_facebook_834722'に' position：absolute'を適用しようとしましたか？それは 'position：relative'との唯一のロゴルールと思われる –