CSS how is width getting set?

Question

I have inherited a web page that has a slide show on it and I can't figure out how to change the width of the <article> containing the slide show. I think it is getting size via JavaScript, but I have searched and can't figure out where.

If you view source on the page you will not see a width in the article tag, but if you use firebug to look at the styles you will see:

 element.style { width: 565px; } 

I've posted a sample version here: http://208.112.58.198/help/index_new.htm .

Answer 1

Your element's CSS width is being applied by the jquery plugin .

/help/wp-content/themes/Cobalt3/cobalt/js/main68b3.js this file line number #339 has the following code.

$('#part-slideshow').carouFredSel({
    height: 300,
    width: '100%',
    circular: true,
    items: {
        visible: 1,
        height: 300,
    },
    scroll: {
        items: 1,
        fx: "crossfade",
        duration: 1000,
        easing: "swing"
    },
    auto: {
        timeoutDuration: 5000,
        delay: 5000,
        pauseOnHover: true
    },
    pagination: '#pagination',
    swipe: {
        onTouch: true,
        onMouse: true
    },
    responsive: true
});

The plugin binds a resize event function to the carousel elements, which sets the element width responsive to the screen size because responsive: true option is added in the call.