Html-css-how To Make Opeanable Vertical Menu
I want to make a menu like this image : When I hover on each item on right menu , it opens a box beside it.As you can see, when mouse hover on each menu , it opens a box beside th
Solution 1:
If i understand you correct try with this:
HTML
<ul><li><ahref="#">Link</a><div>something</div></li><li><ahref="#">Link</a><div>something</div></li></ul>
CSS
ul {
float: right;
}
ulli > div {
display: none;
width: 500px;
height: 300px;
position: absolute;
right: 300px;
top: 0;
background: #eee;
}
ulli:hover > div {
display: block;
}
ulli {
position: relative;
width: 300px;
}
The ul
is the menu and the div
is the white box. He will get visible on hover. For better view add css.
If you have other markup please provide it.
Post a Comment for "Html-css-how To Make Opeanable Vertical Menu"