Question

I’m trying to convert my jquery css to an external css file but had some problems:
1. Is it possible to use sceen.width in an external css file? If not,
2. If I styled an element in an external css file and then used jquery to style the same element, which one will be overwritten?

Example:
jquery:

$("#mainBody").css(
{
   'margin-top':"5px",width: screen.width,
    position:"absolute",top:"135px"
});

external css:

#mainBody
{
   background:#f0eded;
   height:98px;
   margin-top:5px;
}

1. Is there a way to combine an external css file with jquery css? Thanks

Answer 1

Yes, your jQuery styles will override the styles in your stylesheet.

So, you could combine like this

#mainBody{
   background:#f0eded;
   height:98px;
   margin-top:5px;
   width:100px; //ARBITRARY... for example only
}

and

$("#mainBody").css('width', screen.width);

Example: http://jsfiddle.net/jasongennaro/94ZNz/