473,322 Members | 1,781 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,322 software developers and data experts.

Overlapping Dropdown Menu

Hi,
I am using auto suggest drop down menu..by using div tags and css.. below that i have navigation bar by using list items..
when i search in auto suggest the results are display behind the navigation bar...
what can i do....anyone help me ..
Expand|Select|Wrap|Line Numbers
  1. this is for auto suggest css
  2.  
  3. #auto li{padding:0; margin:0px 0px 0px 15px; border:0; list-style:none; position:absolute;}
  4.  
  5. and this for navigation section:
  6. .groupItem .itemHeader
  7. {
  8.     line-height: 23px;
  9.     background-color:#541C03;
  10.     color: #000;
  11.     padding: 0 0px;
  12.  
  13.     font-weight: bold;
  14.     font-size: 16px;
  15.     height: 23px;
  16.     position: relative;
  17. }
  18.  
  19. .groupItem .itemHeader a
  20. {
  21.     position: absolute;
  22.     right: 30px;
  23.     top: 0px;
  24.     font-weight: normal;
  25.     font-size: 11px;
  26.     text-decoration: none;
  27. }
  28. .cross
  29. {
  30.     position: absolute;
  31.     right: 10px;
  32.     top: 0px;
  33.     font-weight: bold;
  34.     font-size: 11px;
  35.     text-decoration: none;
  36.     cursor:pointer;
  37. }
  38.  
  39.  
Aug 28 '08 #1
5 8643
Dormilich
8,658 Expert Mod 8TB
I don't know, whether the problem is caused by this, but I recommend _always_ defining top/bottom, left/right properties when using position: absolute/relative (like the first two clauses).
Aug 28 '08 #2
Markus
6,050 Expert 4TB
Maybe giving the auto-suggest a z-index would help.
Aug 28 '08 #3
I don't know, whether the problem is caused by this, but I recommend _always_ defining top/bottom, left/right properties when using position: absolute/relative (like the first two clauses).
Hi,
i applied the properties that u mention... but still i am getting the same problem
Aug 28 '08 #4
Maybe giving the auto-suggest a z-index would help.
hi,
u told about z-index, where can i put that ...?? i don't know how to apply that..can u explain ( i saw in w3 schools but still i get confused )
Aug 28 '08 #5
Dormilich
8,658 Expert Mod 8TB
hi,
u told about z-index, where can i put that ...?? i don't know how to apply that..can u explain ( i saw in w3 schools but still i get confused )
It's handled like any other property, e.g.
Expand|Select|Wrap|Line Numbers
  1. #auto li {
  2.   /* your definitions here */
  3.   z-index: 20;
  4. }
  5.  
  6. .groupitem {
  7.   /* your definitions here */
  8.   z-index: 10;
  9. }
this should force the browser to draw li above/on top of .groupitem (due to the higher z-index).

Basicly z-index is something like stacking height and in the end you look from above to (more or less) overlapping elements having the ones with lower z-indices beneath the other ones.

note: you can even use z-indices in the range of 1000 an more, only question is, whether this is useful or not (there you have to make your own experiences)
Aug 28 '08 #6

Sign in to post your reply or Sign up for a free account.

Similar topics

1
by: LG | last post by:
I have asked before but I did not get all the answer I wanted. Perhaps I explained too bad. I have my site in frames, and the dropdown list is in the 'left' frame, and I have used javascript so...
1
by: Dino Buljubasic | last post by:
Hi, I have a toolbar with several buttons on it, one of which is set up to be as a DropDown button. I also have a context menu with menu items assigend to it so when I click that button, my...
0
by: Edwin Knoppert | last post by:
I'm busy with overlapping controls, like the ASP net menu shown underneat the listbox control etc.. Absolute position is what i use in this case, no issue to me now. I found a menu on the...
4
torquehero
by: torquehero | last post by:
Hi all :) I have created a horizontal navbar using Xara Menumaker. The Menu items have several dropdown menus. Its a javascript. When the mouse cursor is moved over any menu item, a dropdown...
2
by: William Youngman | last post by:
We are developing an application that presents data to the user in a gridview and we are using the dropdown extender to give the user a SharePoint 2007 type dropdown menu attached to the cells of a...
7
by: Terry | last post by:
Hi again folks. I have a couple of issues now. I am not sure why I can't get my menu to overlap the content area. I tried using z-index. The effect I want occurs in Firefox but not IE. ...
1
by: redgoals | last post by:
Hi, I have searched the forum for a similar problem but have been unable to find anything. What i am trying to achieve is a dropdown menu which behaves in the following way: 1, Someone...
19
by: Jim | last post by:
Hi, I have two questions/problems pertaining to CSS horizontal dropdown menus and am hoping that someone here can help me out. (1) I'm having a problem centering the menu. I picked up the...
2
by: Liam Gibbs | last post by:
Hello everyone. I'm having a problem with a web page. What I have is one DIV (a header) overlapping the border around another DIV (a menu block). I want this, because I want to put this header...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
1
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.