single image equal dimension
- Kleszewski
- Offline Topic Author
- Platinum Member
- I like playing chess.
- Posts: 527
- Thanks: 16
hi
Elements -> Row -> Single image :
Is there any way for a single image so that the photos added here have the same dimension in each position of the added single photo. I mainly mean the height of the photo
If at the beginning their dimensions are different.
Elements -> Row -> Single image :
Is there any way for a single image so that the photos added here have the same dimension in each position of the added single photo. I mainly mean the height of the photo
If at the beginning their dimensions are different.
by Kleszewski
Please Log in or Create an account to join the conversation.
Hi
you can do that using custom css like this
- add a css class on the row : equalimage
- add the custom css in the page
CEd
you can do that using custom css like this
- add a css class on the row : equalimage
- add the custom css in the page
Code:
.equalimage .innercontent, .equalimage .cktype, .equalimage .imageck, .equalimage .imageck img {
height: 100%;
}
.equalimage .imageck img {
object-fit: cover;
}
Joomlack Webmaster and Developer
by ced1870
The following user(s) said Thank You: Kleszewski
Please Log in or Create an account to join the conversation.
- Kleszewski
- Offline Topic Author
- Platinum Member
- I like playing chess.
- Posts: 527
- Thanks: 16
HTML / CSS button
class: equalimage
Template creator-> parameters -> custom css ->
It's almost good
class: equalimage
Template creator-> parameters -> custom css ->
Code:
/*single image resize*/
.equalimage .innercontent, .equalimage .cktype, .equalimage .imageck, .equalimage .imageck img {
height: 100%;
}
.equalimage .imageck img {
object-fit: cover;
}
This message contains confidential information
Last Edit:3 years 10 months ago
by Kleszewski
Last edit: 3 years 10 months ago by Kleszewski.
Please Log in or Create an account to join the conversation.
just checked your url and the images have the same height
Joomlack Webmaster and Developer
by ced1870
Please Log in or Create an account to join the conversation.
- Kleszewski
- Offline Topic Author
- Platinum Member
- I like playing chess.
- Posts: 527
- Thanks: 16
almost equal
Check once again
I have duplicated this element with the css class: .equalimage
Row container dupicate -> css.equalimage ->
I added photos of various sizes, without prior preparation, it came out what you see.
I know that the best solution is to prepare photos of equal dimensions, but I thought that since there is a mechanism in the gallery that scales the photos (crop image), maybe the same technique can be used here
Check once again
I have duplicated this element with the css class: .equalimage
Row container dupicate -> css.equalimage ->
I added photos of various sizes, without prior preparation, it came out what you see.
I know that the best solution is to prepare photos of equal dimensions, but I thought that since there is a mechanism in the gallery that scales the photos (crop image), maybe the same technique can be used here
by Kleszewski
Please Log in or Create an account to join the conversation.
thanks, I see now
please try to add the width 100% like this
please try to add the width 100% like this
Code:
.equalimage .imageck img {
object-fit: cover;
width: 100%;
}
Joomlack Webmaster and Developer
by ced1870
Please Log in or Create an account to join the conversation.
Time to create page: 0.805 seconds