Style jQuery autocomplete results

StackOverflow https://stackoverflow.com/questions/21745648

  •  10-10-2022
  •  | 
  •  

Question

This is how the autcomplete shows results now.enter image description here It is behind the search-bar. Is it possible to bring it above. Also, I want to style it. Can somebody give some style references.

Below is the code for header-container

.header-container {
position: fixed;
top: 0;
background-color: #1E1E1E;
width: 100%;
z-index: 2000;
height: 42px;
}

And this for search input:

#header-search-input {
background-image: url(images/search.png);
background-repeat: no-repeat;
font-size: 12px;
-moz-border-radius: 3px;
border-radius: 3px;
color: #424A61;
border: none;
font-size: 14px;
height: 22px;
width: 355px;
position: absolute;
top: 9px;
overflow: hidden;
right: 40%;
padding-left: 25px;
}
Was it helpful?

Solution

style it:

input#autocomplete { 
 /* styles here */
}

z-index: (It would be optimal to use z-index properly to prevent other problems along the road with the stacking of your elements)

Understanding z-index and stacking order.

OTHER TIPS

Ok i fixed it by altering the z-index to 2 as suggested by airi. Though, I don't really got how it fixed the problem.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top