Convert List items as drop down menu without Jquery [closed] - css

Question

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I've the list items as follows. I'm using an Angular JS application. I need to represent them as drop down menu simply by using CSS. I should not include any JQuery js file
English
Español
Française
Italian
Here is my fiddle.. http://jsfiddle.net/CDrLV/
Can any one look into the following code?

Answer 1

You will want to hide the list with display: none; then show it again on hover.
See this jsFiddle for an example

Answer 2

with this you can http://jsfiddle.net/RdNw4/3/
But I don't know if it's work fine in IE. (probably not)
Help yourself with layout.
HTML
<div class="nav">
<div>Select Language</div>
<ul>
<li>English</li>
<li>Español</li>
<li>Française</li>
<li>Italian</li>
</ul>
</div>
CSS
* {
padding: 0;
margin: 0;
}
body {
padding: 50px;
background: #f3f3f3;
}
.nav {
padding: 10px;
border: 1px solid #ccc;
display: inline-block;
background: #fff;
position: relative;
}
.nav ul {
padding: 5px;
border: 1px solid #ccc;
display: none;
background: #fff;
list-style: none;
position: absolute;
top: 100%;
left: 0;
}
.nav:hover ul {
display: inline-block;
}
ps: I saw it here http://jsfiddle.net/UR4Up/