我得到了以下結構:調整標籤的高度以外TD
<td>
<a>1. menu</a>
<a>2. menu</a>
<a>3. menu</a>
<a>4. menu</a>
</td>
當然,我有指配給元素的類。我正在嘗試將這些元素的高度調整到外部td,以便懸停效果將從頂部填充到底部。
在這裏看到:
任何想法,我怎麼能做到呢?
我得到了以下結構:調整標籤的高度以外TD
<td>
<a>1. menu</a>
<a>2. menu</a>
<a>3. menu</a>
<a>4. menu</a>
</td>
當然,我有指配給元素的類。我正在嘗試將這些元素的高度調整到外部td,以便懸停效果將從頂部填充到底部。
在這裏看到:
任何想法,我怎麼能做到呢?
什麼:
td a {
display: inline-block;
height: 100%;
}
您也可以從td
去除填充(頂部和底部)。
您可以將padding
更改爲a
標籤並刪除td
元素的height
。
如果我們可以看到您當前的CSS實際標記起來會有很大幫助,但是我從您試圖完成的任務中猜測出您需要將填充添加到頂部&底部以實現您想要的外觀。
我可以問爲什麼你把它放在一個表中而不是一個列表?如果你在那裏做一個列表您的代碼會是這樣的:
<div id="custom_menu">
<ul class="links">
<li class="first">
<a>Link</a>
</li>
<li>
<a>Link</a>
</li>
<li>
<a>Link</a>
</li>
<li>
<a>Link</a>
</li>
<li>
<a>Link</a>
</li>
<li>
<a>Link</a>
</li>
<li>
<a>Link</a>
</li>
<li class="last">
<a>Link</a>
</li>
</ul><!-- end class=links -->
</div><!-- end id=custom_menu -->
,這將是你的CSS:
#custom_menu {
width: 850px;
margin: 0px auto;
padding: 0;
}
.links {
list-style-type: none;
margin: 9px auto;
padding: 4px 0 0 30px;
height: 23px;
}
.links li {
display: inline !important;
}
.links em {
display: none;
background-color: red;
height: 55px;
font-size: .7em;
margin: 0 0 0 -50px;
padding: 3px 10px 10px 3px;
position: absolute;
text-align: center;
width: 107px;
z-index: 30;
}
.links .last em {
margin: 0 0 0 -75px;
}
好吧,我基本上偶然發現了需要維護的現有代碼:)我從來沒有這樣做過。 – Kel 2010-09-27 19:07:39
我的人生故事!我會嘗試添加填充和刪除td的高度,但我認爲別人已經提出了這一點。 – Nicknameless 2010-09-27 19:15:30
好吧,我會盡我所能:)謝謝你的幫助。對其他人也是如此。 – Kel 2010-09-27 19:18:03
我嘗試過了,也沒有工作。 – Kel 2010-09-27 18:56:13
剛剛編輯我的答案,你必須從'td' – davehauser 2010-09-27 18:56:43
nope刪除填充,我試過了 – Kel 2010-09-27 18:59:41