0
A
回答
0
我終於得到了答案......所以這是其他誰可能是想使類似的情況腳本..
CSS:
<link href="bootstrap/icomoon.css" rel="stylesheet">
<style>
.crozmap-body #crozmap-footer {
background: #ed6c09;
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: 1001;
}
.crozmap-body #crozmap-footer ul {
margin-left: -15px;
margin-right: -15px;
list-style: none;
margin: 0;
padding: 0;
}
.crozmap-body #crozmap-footer ul li {
position: relative;
float: left;
width: 25%; //this is for 4 column 25%
min-height: 1px;
padding-left: 0;
padding-right: 0;
cursor: pointer;
height: 50px;
text-align: center;
}
.crozmap-body #crozmap-footer ul li a {
color: #fff;
display: block;
height: 50px;
text-align: center;
padding-top: 8px;
font-size: 13px;
}
.crozmap-body #crozmap-footer ul li a:before {
font-family: "icomoon";
color: #fff;
font-weight: bold;
font-size: 20px;
display: block;
}
.crozmap-body #crozmap-footer ul li a:hover {
background-color: #ed9959;
text-decoration: none;
}
.crozmap-body #crozmap-footer ul li a:hover:before {
background-color: #ed9959;
}
</style>
HTML:
<div id="crozmap-footer">
<ul>
<li><a class="icon-share" data-toggle="modal" data-target="#SharedModal">Share</a>
<li><a class="icon-bubble" data-toggle="modal" data-target="#CommentInfoModal"> Comments </a></li>
<li><a class="icon-file" data-toggle="modal" data-target="#CommentInfoModal">Info</a></li>
<li><a class="icon-location" href="#" >Dir</a></li>
</ul>
</div>
相關問題
- 1. 垂直對齊徽標和導航欄?
- 2. 垂直對齊文本在導航欄
- 3. 在導航欄中垂直對齊不同字體的文本
- 4. 垂直對齊導航欄中的文本
- 5. 希望徽標重疊導航欄並讓導航文本垂直對齊:徽標中間
- 6. 垂直對齊引導程序4導航欄摺疊按鈕
- 7. 在導航欄中垂直對齊鏈接和徽標
- 8. 如何垂直對齊此導航欄?
- 9. 如何垂直對齊此導航欄?
- 10. Oracle APEX 5.1側面導航欄圖標不垂直對齊
- 11. 引導按鈕中的文本和圖標的垂直對齊
- 12. Bootstrap導航欄中的堆疊文本
- 13. 使用圖標垂直對齊文本
- 14. Bootstrap 3對齊堆疊式導航中的圖像和鏈接
- 15. 主導航欄和垂直導航欄?
- 16. CSS導航垂直對齊
- 17. 垂直對齊導航
- 18. 在導航中對齊文本(水平和垂直)
- 19. 自舉垂直對齊和子導航
- 20. 垂直導航欄/側邊欄對齊元素爲中心
- 21. Bootstrap - 防止iPhone上的垂直堆疊導航欄
- 22. 使導航欄垂直對齊固定在中間
- 23. 垂直對齊標籤和文本框
- 24. 在堆疊面板中對齊文本的垂直和水平中心?
- 25. 垂直對齊標籤中的文本
- 26. 垂直導航欄?
- 27. 垂直導航欄
- 28. 引導文本垂直居中對齊
- 29. 垂直對齊文本和圖像
- 30. IOS - 垂直對齊導航欄中的後退按鈕