Set fixed width to Nivo Slider

css nivo-slider
Steve picture Steve · Oct 22, 2013 · Viewed 7.2k times · Source

I've installed Nivo Slider using the code from the demo included in the free download.

All of the images I am including in the slider are 800 pixels wide.

However, they are being resized to 1440 pixels wide. Extra code is being inserted:

<img src="images/bar.jpg" data-thumb="images/bar.jpg" alt="" title="" style="display: none; width: 1440px;">

I have searched the CSS and JS and can find no mention of 1440.

Where is this width being set?

Answer

Mr. Alien picture Mr. Alien · Oct 22, 2013

Nivo Slider is responsive by default, if you want to limit the sliders width, use the below class in your CSS

.slider-wrapper.theme-default {
   width: 800px; /* Desired width */
}

The above will work if you are using default theme of nivo slider, if you are using some other theme, than simply change the .theme-default to theme specific class which is assigned to the slider wrapper.

Related questions

nivo slider image resize issue

I have nivo slider in my web page. I need to display images of various width and height.The larger image displays behind the smaller image. Please refer the following screenshot. I have to remove displaying larger image behind the …

Read More
Jquery, Nivo slider overlays dropdown menu

I have this website where i use both nivoslider and my ownmade dropdown menu but as it happens to be once the slider shows a picture the menu gets behinds the slideshow. It can be seen on the website im …

Read More
Centering image on Nivo Slider using default theme?

To anyone who uses Nivo Slider, is there any straightforward way (or not) to center the image on the slider? I'm aware that Nivo Slider was designed to display images which perfectly "fit" the box (unlike the way I'm using …

Read More