Same slider between 2 pages not the same

The CSS snippet you posted styles page 164. It doesn’t style the other one. It needs to be:

.page-id-164 .carousel .item,
.page-id-XXX .carousel .item {
line-height: 50px;
overflow: hidden;
min-height: 201px;
}

where XXX is the number of the second page. (I’m on a phone right now, so cannot look up the ID myself. Edit the page and look at the URL for the ID, or find it with Firebug.)

I was using 2 snippets, one for each page. Sorry I didn’t make that clear.
Each one had their own page numbers. Tried to use a different image yesterday, had the same problem.

OK now it’s looking good, never thought to link both together, but it worked. THanks

Maybe there was a syntax error in one of the rules that got fixed when you brought them together. (You don’t need to bring them together, but every little helps in keeping the size of the CSS file to a minimum.)

Now I am having a problem again with the same page (164) but a different slider image. Again it’s blown up. The code is the same (which worked) for the other slider. The image size is the height as the old one. Using the DEV TOOLS “Inspector” within firefox the min-height line is missing, and even when I add it in the inspector it shrinks it a little but not properly.

Any ideas?

The image that works is 1,327px × 201px. The image that is being stretched is 757px × 200px.

At any screen size bigger than 757px, the image must stretch to fill the window. Customizr always stretches the width and height equally, so as not to distort the image (it maintains the “aspect ratio”). So the image is chopped off at the top and bottom in your case.

You need to make the second image as wide as the first for them to behave in the same way.

Ahhh, that makes sense. Thanks a million