SORU
19 HAZİRAN 2010, CUMARTESİ


Nasıl gezinti çubuğu listesinde bir öğe, bir link olarak tıklanabilir bütün alan yapabilirim?

Bende bir yatay menü yapımı bir sırasız liste ve her bir liste öğesi bir çok doldurma göstermek için güzel, ama sadece o alanda çalışır gibi bir bağlantı metni kendisi. Nasıl kullanıcı listesi her aktif madde için tıklatın etkinleştir bağlayabilirsiniz?

html:

<html>
  <head>
    <link type="text/css" rel="stylesheet" href="/stylesheets/test.css" />
    <link rel="shortcut icon" href="/images/favicon.ico" >
  </head>

  <body>
    <div id="nav">
    <img src="/images/renderedicon.png" alt="Icon" height="57" width="57"/>
      <ul>
        <li><a href="#">One1</a></li>
        <li><a href="#">Two</a></li>
        <li><a href="#">Three</a></li>
        <li><a href="#">Four</a></li>
      </ul>
    </div>
    <div>
      <h2>Heading</h2>
    </div>
  </body>
</html>

css:

#nav {
  background-color: #181818;
  margin: 0px;
  overflow: hidden;
}

#nav img {
  float: left;
  padding: 5px 10px;
  margin-top:auto;
  margin-bottom: auto;
  vertical-align: bottom;
}

#nav ul {
  list-style-type: none;
  margin: 0px;
  background-color: #181818;
  float: left;
}

#nav li {
  display: block;
  float: left; 
  padding: 25px 10px;
}

#nav li:hover {
  background-color: #785442;
}

#nav a {
  color: white;
  font-family: Helvetica, Arial, sans-serif;
  text-decoration: none;
}

CEVAP
19 HAZİRAN 2010, CUMARTESİ


Dolgu koyma 'li' öğe. Bunun yerine display:inline-block; çapa etiketi ayarlamak ve dolgu uygulayın.

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • AndroidSale

    AndroidSale

    17 NİSAN 2011
  • Damien Hayes

    Damien Hayes

    11 Mart 2008
  • TheOtherMau5

    TheOtherMau5

    6 Mart 2012