Geek Answers Handbook

Setting the autocomplete drop-down box

I am using the jquerys autocomplete widget , but I have several problems trying to style a field that falls out when looking for something.

I'm trying to move the block a bit and change the border color / bg, but some JS add some inline styles that override my .css styles. But I can’t find him.

I'v founded my this one .

<ul class="ui-autocomplete ui-menu ui-widget-content" role="listbox" aria-activedescendant="ui-active-menuitem" style="z-index: 11; display: block; width: 139px; top: 44px; left: 1101px; "><li class="ui-menu-item" role="menuitem">
+5
source share
6 answers

To avoid use !important, you can add your styles with jQuery and override them that way.

$('ul.ui-autocomplete').css({
    color: 'red'
});

Another solution would be to remove the style attribute from ul.

$('ul.ui-autocomplete').removeAttr('style');
+7

css .css, , Firebug, , , !important; CSS.

.

ul.ui-autocomplete {
color: red !important;
}

- , jQuery - , , JS CSS.

! ; , - .

+4

margin-top margin-left css

top left , , .

+2

jquery, , , (jquery.ui.menu.css). , - , , .

http://docs.jquery.com/UI/Menu#theming

.

" , jquery.ui.menu.css, , , ." - jquery.

+2

Check the file jquery.ui.theme.css,

the class .ui-widget-contentnear the top can be used to put the background color in the field of autocomplete search results, borders and positioning can also be changed through this class.

+2
source

More articles:


All Articles