İletişim linki

Benim kodlama şimdiye kadar oldukça basittir diğer bağlantılarda kadar yükseliyor. En sağdaki iletişim bağlantım yükseliyor ve bağlantı alanı olarak işlev gören diğer bağlantıların üzerinde ekstra bir alana neden oluyor. Css'imi kontrol ettim ve her şey güzel görünüyor, ama oldukça yeni ve çok basit bir şey olabilir.

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Derek Edwards Portfolio</title> 
<link href="Web Porfolio.css" rel="stylesheet" type="text/css" /> 
</head> 

<body class="mainbody"> 

<nav> 
    <p> 
     <ul class="navbar"> 
      <li class="listitem"><a href="#"/>Contact</li> 
      <li class="listitem"><a href="#"/>Portfolio</li> 
      <li class="listitem"><a href="#"/>About</li> 
      <li class="listitem"><a href="#"/>Home</li> 
     </ul> 
    </p> 

</nav> 
</body> 
</html>

Benim css de oldukça basittir: İşte kod

@charset "utf-8"; 

.mainbody { 
margin:0px; 
padding:0px; 
background-image:url(../../Desktop/Portfolio/Background.jpg); 
background-size:100%; 
background-attachment:fixed; 
} 

.navbar { 
position: fixed; 
top: 0; 
width: 100%; 
margin: 0; 
padding: 0; 
overflow: hidden; 
background-color: #333; 
opacity: 0.4; 
} 

.listitem { 
float: right; 
border-left: 1px solid #bbb; 
list-style-type: none; 
} 

.listitem a { 
font-family: Verdana, Geneva, sans-serif; 
font-size: 1em; 
display: block; 
color: white; 
text-align: center; 
padding: 10px 5px; 
text-decoration: none; 
} 

.listitem a:hover { 
    background-color: #111; 
}

kaynak

2016-04-02 Derek Edwards

yılında ".listitem bir" olması gerektiği

display: inline-block;

Bu düzeltecektir. Kodunuzdaki bazı şüpheli kararlar, ancak sorununuzu halledecektir.

kaynak

2016-04-02 03:24:53 jons

Teşekkür ederiz! Şimdi benim link ve sınır arasında boş bir bağlantı alanı ekliyor. –

İletişim linki

cevap

İlgili konular