floating_menu.css in Floating Menu 8
#block-floatingmenu {
position: fixed;
right: 0;
top: 35%;
display: block;
z-index: 10;
}
.popup-item {
margin-bottom: 5px;
height: 50px;
width: 70px;
color: #000;
position: relative;
}
.item-text {
display: block;
float: left;
}
.item-icon {
display: block;
float: right;
position: absolute;
right: 0;
text-align: center;
line-height: 50px;
z-index: 999;
box-shadow: 0px 0px 5px 2px #999;
}
.item-text {
background: #fff;
display: block;
width: 230px;
top: 0;
bottom: 0;
right: -240px;
position: absolute;
}
.menu-item-popup {
min-height: 50px;
padding: 10px;
background: #fff;
box-shadow: 0px 0px 5px 2px #999;
}
.item-icon {
height: 50px;
width: 50px;
background-color: #fff;
}
@media (max-width: 768px) {
#block-floatingmenu {
display: none;
}
}
File
css/floating_menu.css
View source
- #block-floatingmenu {
- position: fixed;
- right: 0;
- top: 35%;
- display: block;
- z-index: 10;
- }
- .popup-item {
- margin-bottom: 5px;
- height: 50px;
- width: 70px;
- color: #000;
- position: relative;
- }
- .item-text {
- display: block;
- float: left;
- }
- .item-icon {
- display: block;
- float: right;
- position: absolute;
- right: 0;
- text-align: center;
- line-height: 50px;
- z-index: 999;
- box-shadow: 0px 0px 5px 2px #999;
- }
- .item-text {
- background: #fff;
- display: block;
- width: 230px;
- top: 0;
- bottom: 0;
- right: -240px;
- position: absolute;
- }
- .menu-item-popup {
- min-height: 50px;
- padding: 10px;
- background: #fff;
- box-shadow: 0px 0px 5px 2px #999;
- }
- .item-icon {
- height: 50px;
- width: 50px;
- background-color: #fff;
- }
-
- @media (max-width: 768px) {
- #block-floatingmenu {
- display: none;
- }
- }