Hide Title bar and Show Close Button in jQuery Dialog

css, jquery, jquery-dialog

Solution

Adding the following CSS will hide the title text and style, leaving the close button in place - see demo.

.ui-dialog-title {
    display:none;
}

.ui-dialog-titlebar {
    background:transparent;
    border:none;
}

.ui-dialog .ui-dialog-titlebar-close {
    right:0;
}

However, if you want to change the style of the close button itself (as mentioned in your other question - Arrow in Bottom of jQuery Dialog) then I suggest asking another question since showing the `closeText` is still a problem when using a jQuery theme - see jQuery UI Dialog - Cannot see the closeText

Problem

I have hide title bar in `jQuery Dialog` as below ``` $(".ui-dialog-titlebar").hide(); ``` This also hide close button in `Dialog`. But i need to show close button on `Dialog`. How can i do this ?

Original source

Related problems