How to edit the element.style css?

Issue

Hi I am using a jquery modal pop up. See picture below.

However, the problem is, I need to edit the width. So I typed in the css file, after checking and verifying with firebug,

element.style 
{
    width: 700px !important;
}

But it does not work. ANy ideas as how to override the jquery css.

Some say the need to edit the css using javascript, making objects and stuff. But I'm not so sure about that.

Any help is appreciated.

Solution

element.style in Firebug is the style applied to the element, for exemple

<span style="padding: 10px;">My text</span>

element.style will have

element.style 
{
    padding: 10px;
}

to override, the best way is to cleat the style attribute, append a class name and write the CSS you need.

---

Regarding your modal problem, if you are using jQuery UI Dialog component, why don't you set the width programmatically, like:

$( ".selector" ).dialog({ width: 460, maxWidth: 460, minWidth: 460 });

Answered By - balexandre