setting a whole style string to an element from javascript (not individual style parameters)

javascript css stylesheet
Nir picture Nir · Jun 11, 2009 · Viewed 35.3k times · Source

I need to set an arbitrary style to a span via javascript.

I know I can do things like: span.style.height="250px"; But I need to be able to insert a random full style definition from a template

for example

float:left; 
text-decoration:underline; 
cursor:pointer; 
color:blue;

Is there a way to do that in Javascript? Something like:

element.style="all style definition here";

Answer

ajm picture ajm · Jun 11, 2009

How about the .style.cssText property? Here's Microsoft's explanation.

Throw it the styles you'd like to apply like so:

document.getElementById('myEl').style.cssText = 'float:left;margin-top:75px;';

As for browser support, although it was IE-proprietary I believe it's well-supported (works in the IEs, FF3, and Safari 3.2 WIN at least).

Related questions

How to dynamically create CSS class in JavaScript and apply?

I need to create a CSS stylesheet class dynamically in JavaScript and assign it to some HTML elements like - div, table, span, tr, etc and to some controls like asp:Textbox, Dropdownlist and datalist. Is it possible? It would …

Read More
How to get an HTML element's style values in javascript?

I am looking for a way to retrieve the style from an element that has a style set upon it by the style tag. <style> #box {width: 100px;} </style> In the body <div id="box"&…

Read More
"The stylesheet was not loaded because its MIME type, "text/html" is not "text/css"

I have a javascript application and when I run it on firefox I am getting the following erro on the console: "The stylesheet was not loaded because its MIME type, "text/html" is not "text/css". DumbStuck!! EDIT: Note that …

Read More