Shelane,

I had the same issue with the close button not showing. When I made my
theme using ThemeRoller, I left my icon color the same as the default
background color. I guess is was not clear to me how they interact in
the various components, since they looked fine on the demo page. BTW,
this was only happening in IE 6 and it would appear after you clicked
into the content area of the dialog. This seems to indicate that the
close icon is starting in active mode in IE.

My fix was to copy the default background url for: .

ui-dialog-titlebar-close

to

.ui-dialog-titlebar-close:active

I also had the issue of the title bar being aligned left and not
filling the full width. I fixed this by modifying .ui-dialog-titlebar.
The big fix is to add a width of 100%, but that left some alignment/
sizing issues. The best fix for this that I could come up with is to
take the values that are assigned for padding top left and right and
assigning them as negatives to the margin. This way they cancel out
and the background gets applied uniformly.

Original titlebar section:

.ui-dialog-titlebar {
        /*resets*/margin: 0; padding: 0; border: 0; outline: 0; line-height:
1.3; text-decoration: none; font-size: 100%; list-style: none;
        padding: .5em 1.5em .5em 1em;
        ...

Added to fix titlebar sizing:
        width: 100%;
        margin: -.5em -1.5em 0 -1em;

I have 2 additional issues.

First the button bar on the bottom was not filling the full width in
IE 6. This can be fixed by adding a left: 0 to .ui-dialog-buttonpane.
I'm not sure why this container was not anchor from 2 edges anyways.
Centering this is still a bit of a problem. I got it pretty good with
adding: padding: 0 1em 0 1em; but I'm not sure I like this solution.

Second, the autoResize doesn't work right in IE. When resizing the
Dialog, the content grows at a faster rate and quickly goes off the
right side. If I disable this and set the width to 100% for the div
everything works fine.

Not sure if this may have anything to do with this but our dynamic
page declarations start with:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3c.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml";>
<head>
<meta content="text/html; charset=iso-8859-1" http-equiv="Content-
Type"/>

Regards,
Dom

On Sep 24, 11:30 am, Shelane Enos <[EMAIL PROTECTED]> wrote:
> I just downloaded the 1.6rc2 to see if it fixed this issue. The work around
> I found worked for resetting the content, but my title bar is still shifted
> to the left.  1.6rc2 didn't fix it.  Also, I tried to click on the
> "Development" link and I got a 404 error.
>
> On 9/15/08 8:47 AM, "Shelane Enos" <[EMAIL PROTECTED]> wrote:
>
>
>
> > It's the latest jQuery, latestdialogdone from the configure your download,
> > and a theme roller style sheet.
>
> > On 9/12/08 4:44 PM, "Kevin" <[EMAIL PROTECTED]> wrote:
>
> >> What css and js files are you using? I created both off of http://
> >> ui.jquery.com
> >>  I only had to change the .ui-dialog-content.
>
> >> I did have similar issues using the js from http://  latest.jquery.com
> >> and a themeroller css file.
>
> >> On Sep 12, 2008, at 2:29 PM, Shelane <[EMAIL PROTECTED]> wrote:
>
> >>> My close button is not visible because it's where it should be and the
> >>> color of mine is white - so white on white (where the background
> >>> doesn't extend).
>
> >>> On Sep 12, 11:18 am, Shelane <[EMAIL PROTECTED]> wrote:
> >>>> It only partially fixed it for me.
>
> >>>> It moved my content, but my title bar is skewed left and the close
> >>>> button is not visible.  When I tried that margin trick for the
> >>>> titlebar, it only made the titlebar background shorter it didn't move
> >>>> it at all.
>
> >>>> On Sep 11, 8:16 am, "[EMAIL PROTECTED]" <[EMAIL PROTECTED]> wrote:
>
> >>>>> Matt,
>
> >>>>> Thank you for posting the fix to this issue. Looks great in IE6 now.
>
> >>>>> Kevin
>
> >>>>> On Aug 6, 10:11 am, Matt Hoskins <[EMAIL PROTECTED]> wrote:
>
> >>>>>> I had a quick search on this group as I was having problems with
> >>>>>> setting "overflow: auto" on adialogthat was themed using theme-
> >>>>>> roller. The scroll bars didn't seem to appear under firefox when
> >>>>>> they
> >>>>>> should have done.
>
> >>>>>> Using firebug I saw that actually the content div was ending up
> >>>>>> bigger
> >>>>>> than the containingdialogand was being clipped. Under IE 6 things
> >>>>>> get even more confused with the content being shifted to the left
> >>>>>> (I
> >>>>>> see there's a recent thread about this).
>
> >>>>>> Looking at the flora theme I see it uses margins on the content
> >>>>>> div to
> >>>>>> bring the content away from theborderrather than padding, so I'm
> >>>>>> guessing that thedialogstuff doesn't support padding on the content
> >>>>>> div but does support margins.
>
> >>>>>> For those having problems with the theme builder themes and
> >>>>>> dialogs as
> >>>>>> a result of this padding, just edit the css file from the theme to
> >>>>>> change the padding for the second .ui-dialog-content definition
> >>>>>> to be
> >>>>>> margin instead.
>
> >>>>>> E.g.:
> >>>>>> padding: 1.5em 1.7em;
>
> >>>>>> Becomes:
> >>>>>> margin: 1.5em 1.7em;
>
> >>>>>> You can then apply overflow: auto to thedialogand you'll get scroll
> >>>>>> bars appear if the content is oversized.
>
> >>>>>> Regards,
> >>
>>>
> Ma

--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups 
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at 
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---

Reply via email to