CSS to Stretch Image to Fit in Slider

Posted in: Newspaper
Post count: 263

Has anybody figured out the correct CSS that expands the image to fulfill the sliders image. Example http://screencast.com/t/Mjlo9S6lg

Post count: 854

hi

try to use this :

.iosSlider .slider .item img {
  width: 1980px !important;
  max-width: none; 
}

change 1980 to what ever you want

Thanks for you message.
Radu A.

Post count: 263

@Radu, thanks. That sorta works. How about a regular image to fit dimensions in height and width of block 3 (or any blocks really): http://screencast.com/t/H7jkjxtt2g35

Post count: 6600

Hi,

You could do it via css using this custom css:

.td_mod6 .entry-thumb {
width: 326px;
height: 159px;
}

This way you set the image to fill the image container by setting the exact width and height of the container.
You can do the same for other block if you like.
This is for block 3 images which was made using module 6, see here: https://forum.tagdiv.com/modules-and-blocks/
This dose’t look so good though, see here:
ex:
http://screencast.com/t/KsvELvwnl
http://screencast.com/t/QfDa3x3kH

Hope this helps!
Thanks

Post count: 263

@Lucian, this works fine. Stretches it a big but it still works. As for block 1 where it has the large image at the top and the mini ones below it, http://screencast.com/t/GjlJQoerhYMZ, what are your suggestions for this?

Post count: 263

Also, when using this in the slide I noticed it actually stretches the video icon. Is there any way around this (http://screencast.com/t/zZdY6ElFPh)? If not, how do I remove the player image?

Post count: 6600

Hi,

Use this css to stretch the small thumbs of block 1:

.td_mod3 .entry-thumb {
width: 100px;
height: 65px;
} 

And this css is to remove the video icon:

.iosSlider .slider .item .video-play-icon-big {
display: none;
}

Hope this helps!
Thanks

Post count: 263

Thanks for the help @Lucian!

Viewing 8 posts - 1 through 8 (of 8 total)
The forum ‘Newspaper’ is closed to new topics and replies.