getComputedStyle or currentStyle for border-left-width

My HTML : <div id="bar" ></div>

My CSS :


My JS :

function getStyle(el,styleProp)
    if(el.currentStyle)var y=el.currentStyle[styleProp];
    else if(window.getComputedStyle)var y=document.defaultView.getComputedStyle(el,null).getPropertyValue(styleProp);
    return y;

alert(getStyle(document.getElementById("bar"),"border-left-width"));//Outputs 0px

The fiddle :

How can I get the border-left-width property? (with my exemple it's not working (on firefox))


Check your border-left-style property. It's set to none (the default). Set it to something like solid and you're good to go:

To support older browserss you'll need to change the hyphenated-css to camelCase.

You can use camelCase in the other browsers as well, and read the properties of the getComputedStyle object directly.

function getStyle(el, css){
    if(window.getComputedStyle) return getComputedStyle(el, '')[css];
    if(el.currentStyle) return el.currentStyle[css];    


Note- the css definition needs a style as well as a width for a border to have a computed width (and it can't be set to display:none when you compute its dimensions...)

use jQuery

this works:

Need Your Help

Why doesnt hasnext,hasprevious etc methods of Iterator or listIterator check for ConcurrentModificationException

java collections

I know that failfast iterators check for ConcurrentModificationException on best-effort basis.Why doesnt the methods such as hasnext or hasPrevious check for ConcurrentModificationException and th...

ASP with Crystal Report 9 hangs on .NET framework 3.5 iis .net-3.5 crystal-reports windows-server-2003

We have an ASP (not ASP.NET) application running on Windows 2003 server. One of the functions of the application is to generate reports using Crystal Report 9.