Community Learn Tools Library Leisure
search
English
Home > Web Front-end > HTML Tutorial > body text

css hover drop-down menu_html/css_WEB-ITnose

WBOY
Release： 2016-06-24 12:17:41
Original
1174 people have browsed it

This post was last edited by BaronZ on 2012-12-19 15:41:05

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;}
Copy after login

<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>
Copy after login


Reply to discussion (solution)

Thanks for sharing your experience

ul.cssMenu li:hover > ul            {     display:block;    background-color:red;    top:-150px;    left:50px;}
Copy after login

There seems to be a problem with positioning

Related labels：
css hover下拉菜单
source：php.cn
Previous article：Why is the absolutely positioned div not centered in IE6? _html/css_WEB-ITnose Next article：Image path problem_html/css_WEB-ITnose
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Latest Issues
Center dropdown menu in navigation bar I made this CSS/HTML. .navbar{width:100%;background-color:rgb(151,44,44);overflow:auto;}.n...
From 2024-04-04 18:24:52
0
1
338
Personalize the look of Select2 Dropdown In my case, I'm using select2Combobox for my dropdown. Here, when the Country selection ch...
From 2024-04-03 11:27:22
0
1
338
Vanilla JS setTimeout(): Identifying wrong behavior I have an animation on my hamburger menu written in HTML, CSS and vanilla JavaScript. Expe...
From 2024-04-02 20:44:40
0
1
284
My bootstrap 4 dropdown is not working and I don't know how to fix it I'm very new to HTML and I've been trying for hours to get my dropdown menu to work. I sea...
From 2024-04-02 18:12:59
0
1
283
Make sure the dropdown always appears on top of its parent, position: relative I'm trying to achieve something like below. The container contains a set of dropdowns that...
From 2024-04-01 18:43:16
0
1
316
Related Topics
More>
Popular Recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template