Adjusting staged image container width

[yumiko7]

Hi Jason,
Thank you for the great theme plus all the tutorial videos, plugins and support.
I am having trouble adjusting the width of the container of staged images in a slider.
I used your image width plugin to change the width of an image,
but the container remains default 542 px wide.
I’d appreciate if you could take a look and advise.
http://nakamuracommunications.com/slider-test-3/
Thanks!

Topic

[Jason Bobich]

Hello,

On this one, you’ll also need to customize the CSS there splitting the two sections in the staged slide. Basically, by default, you’ve got a 60%/40% split going on between the two sections. Here’s a theoretical way you could adjust this:

.slide.tight .grid_fifth_3 {
	width: 60%;
}
.slide.tight .grid_fifth_2 {
	width: 40%;
}

So, you’d want to play with those number until it looks the way you want. Maybe something like 54%/46%.

For CSS changes, it’s a good idea to use a tool like firebug or Google Chrome’s built-in developer tools to locate them and then put the edits either in your child theme or in the “Custom CSS” option on your theme options page.

Also, here’s a helpful tutorial on how to use Firebug – http://vimeo.com/20917974. The only thing I’d suggest not doing is actually making edits to the theme’s CSS files, as it shows at the end of that video. However, the video serves as a good introduction to Firebug and how it can be used to find what CSS is effecting certain areas of your site without ever digging around in any files.

[yumiko7]

OMG… I never expected such a quick response! Thank you, Jason.

However, when I put the CSS you provided in the “Custom CSS” option and set it to 50% / 50% to test, it does not produce the change. What do you mean by “a theoretical way”? Is this not the actual CSS?

Sorry to keep asking for help..

[Jason Bobich]

You’ve got a typo in your custom CSS:

#featured .element-slider .standard-slider-wrapper li.slide {
    height: 280px;

… On this part before the code I gave you, you don’t have a closing bracket.

[yumiko7]

How embarrassing. Sorry to have bother you on that, and thank you again for your support.

[Author]

Replies