My code is now that when the mouse moves over the root, the drop-down menu appears under the root. I want to change it so that when the mouse moves over it, the drop-down menu appears on the right side of the root (on the same line as the root). Is it possible? How do I change the code?
ul.cssMenu, ul.cssMenu ul{ list-style:none; margin:0; padding:-10; position: relative;}ul.cssMenu ul { display:none; /*initially menu item is hidden*/ position: absolute; /*absolute positioning is important for menu to float*/ }ul.cssMenu li:hover > ul { display:block; background-color:red;}<html><link href="1.css" type="text/css" rel="stylesheet" /><ul class="cssMenu"> <li> <font color="blue">root<font> <ul> <li><a href=#>sub</a></li> </ul> </li></ul></html>
Thanks for sharing your experience
ul.cssMenu li:hover > ul { display:block; background-color:red; top:-150px; left:50px;}There seems to be a problem with positioning
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
