I'm having trouble with applying border-radius to a container element in my CSS. Despite setting the border-radius property, it doesn't seem to be taking effect.
Here's my code:
* {padding: 0;margin: 0;font-family: monospace;}.container {display: inline-block;position: relative;border-radius: 5px;}.language {list-style: none;background: #22438C;display:inline-block;}a {display: block;padding: 20px 25px;color: #FFF;text-decoration: none;font-size: 20px;}ul.dropdown li {display: block;}ul.dropdown {width: 100%;background: #22438C;position: absolute;z-index: 999;display: none;}.dropdown a:hover {background: #112C66;}.container:hover ul.dropdown {display: block;}<div class="container"><a class="language" href="#">Languages ▾</a><ul class="dropdown"><li><a href="#">English</a></li><li><a href="#">German</a></li></ul></div>