下拉菜單中的徽標不與內部鏈接

我試過以各種格式提出這個問題3天。我似乎無法隔離問題。下拉菜單中的徽標不與內部鏈接

我有一個使用隱藏複選框的下拉菜單。

我已將我的徽標附加到該菜單的底部。

觸發時，菜單向下滾動。徽標隨着它下滑。

問題在於徽標位於菜單鏈接下方的另一行，因此菜單下降太低，與標題衝突。

我想標誌向下滾動的菜單，但在同一行顯示的鏈接，從而通過標識

我試過inline-block的高度降低了打開的菜單的高度， inline，以及其他一百萬次調整，都無濟於事。

這裏的小提琴http://jsfiddle.net/shivashivashiva/cdh8tnvf/2/ enter image description here

來源

2015-02-17 softcode

這是你想要什麼？ Fiddle

將一個內部div添加到菜單中，以便everyting絕對可以與此相關。

這需要#logo出像UL的：

<span id="logo"></span> 
<ul> 
    <li><a href="#">how it works</a></li> 
    <li><a href="#">about us</a></li> 
    <li><a href="#">contact</a></li> 
</ul>

然後進行標識：現在的位置是：絕對的; bottom：0;

保持在線以上。

來源

2015-02-17 21:25:56 bobdye

不完全。我**希望**標頭崩潰，並且我希望鏈接可見。感謝您的回覆 – softcode 2015-02-17 21:28:40

因此，鏈接出現時標題應該變大？如果是這樣，那麼徽標是否應該低於水平線？ – bobdye 2015-02-17 21:32:29

是的標題應該放在鏈接的下面，給人的印象是這條線「揭示」他們。同時，標誌應該堅持行。 @bobdye – softcode 2015-02-17 21:36:22

看到這個updated fiddle

我改變了position:absolute到relative在.menu定義（第二定義）。

.menu { 
    position:relative; 
}

來源

2015-02-17 20:46:47 Ted

感謝您的回覆。我並不是想暗示我試圖以犧牲當前設計爲代價來實現此功能，例如使用下拉菜單推送內容。 – softcode 2015-02-17 20:51:45

此外，這並不能解決問題。徽標和鏈接仍然不內聯。 @Ted – softcode 2015-02-17 21:07:40

啊，我明白你現在在說什麼，讓我鄙視 – Ted 2015-02-17 21:08:24

您應該添加以下把標誌和文字在同一行：

menu ul { 
    float: right; 
} 

#logo { 
    float: left; 
}

而且在我的Firefox版本35.0.1文本是因爲使用的

的不完全可見

.menu ul{ 
    overflow:hidden; 
}

以及您用於菜單的最大高度。你也應該在那裏做一些調整。如果你還想調整文本行高度，以垂直居中與圖像的文字，你可以調整填充。菜單李

來源

2015-02-17 21:10:52 crisu

這不起作用菜單不下拉。感謝您的答覆。 – softcode 2015-02-17 21:14:18

看到這個。 http://jsfiddle.net/cdh8tnvf/14/。添加浮動：右鍵只是.menu ul，它的工作原理。 – crisu 2015-02-17 22:05:12

不，它不起作用。它不符合規定的要求。 – softcode 2015-02-17 22:44:16

下拉菜單中的徽標不與內部鏈接

回答

相關問題