Why is MVC 4 basic CSS jacking up jquery-ui's dialog box?

Question

Any css ninjas might be able to guess why when I include MVC 4's basic css file in my project it causes Jquery UI's dialog box to have issues? The title bar appears next to the content and of course everything is all jammed up - needless to say, it doesn't look good.

I am no HTML ninja but it seems like something is causing a "float: left" or something like that although I can see right in the HTML (using firebug) that "display: block;"

Uhm - here is the HTML that and JS that I am using however I don't know that it really helps.

        $("#addCompanyDialog").dialog({
            title: "Add New Company",
            autoOpen: false
        });

        $("#addCompanyLink").click(function (evt) {
            evt.preventDefault();
            $("#addCompanyDialog").dialog("open");
        }); 

<div id="addCompanyDialog" style="display:none; background-color: yellow; ">
    <input type="text" id="companyName"/>
    <input type="submit" id="addCompany" value="Add Company"/>
</div>

if I comment out this line

@Styles.Render("~/Content/css")

The dialog box is back to normal i.e. the title bar above the textbox and button.

Thanks

Uhm, it's just a local project running in visual studio 2010 with mvc 4 installed — Kenn
– Kenn, Commented Jun 14, 2012 at 13:00

Kenn · Accepted Answer · 2012-06-15 03:09:01Z

4

I found it - They override some jquery-ui stuff in there. Here is the offending bit of CSS

.ui-dialog-titlebar {
    color: inherit;
    font-weight: inherit;
    border: 0 none;
    background: none;
   /* float: right;*/    
}

I kept searching for div and actually searched for "float" but missed this last night, I thought it was worth looking for because it is a pretty good CSS template to start with so maybe this will help someone else.

Sweet!

answered Jun 15, 2012 at 3:09

Kenn

2,7793 gold badges31 silver badges61 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Why is MVC 4 basic CSS jacking up jquery-ui's dialog box?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related