John John - 3 days ago 5
jQuery Question

CSS Drop Down Menu behind JQuery Dialog

The drop down menu is currently showing behind the JQuery dialog box. I'd like to show the drop down menu in front of the dialog box. I tried to change the z-index, but no luck.

$( function() {
$( "#dialog-1" ).dialog({
appendTo: $("#bodyContent")
});
} );


jsfiddle: https://jsfiddle.net/john12345/ofrhodpv/

Thank you!

Answer

The dialog box has a z-index: 1003; so to overlap it you need to give the dropdown menu a bigger value more than 1003

see demo

Comments