Hi
The image are using max-width: 100%; on the wall stream, if you will manually set a width and height for the image it will break and aspect ratio and also show same width for all screen size.
You can force the image via CSS code to use static size.
Regards
Hi,
I don't want to break the layout. I want the images to resize to fit the designated width and height. Right now it doesn't do that. When I upload images on JomSocial, I don't have to resize it, and it gives me options to crop. How can I set all that up so my site can be user friendly? I don't know css code.
Thanks,
Hi
The suggestion is for wall stream because when I replied there was no image showing in your first post.
When you upload an image on site it will use its original size. And if you will not crop it for thumbnail it will use the original size.
This is how it works, the profile has the same size of the container and it will auto resize the images, if you will force the image via CSS it will break the aspect ratio of the image.
Let me know if you want to change the size of the thumbnail container because auto resize of image always depends on the container size, and auto crop does not a solution as every image has a different graphic in it.
Regards
Hi
This is not the profile pic.
Its the event image that is in the background.If you will modife the background css it will not fill the full space of background.
Try this code in /css/custom.css file if you want to show the full background image.
.joms-list--card .joms-list__cover-image {
background-size: contain!important;
}
Hi
Kindly check there is no code in custom.css file as I suggested here: your site URL /templates/ja_magz_ii/css/custom.css
Once you added the code it will look like this : Removed
Its not an issue, background image fill the full space if you will force it to show 100% it will not fill the full container space.
Regards
Hi
We removed the link and screenshot.
I added it to show the code is correct and if you will add the code how it will look on your site.
Regards
Hi
I checked the site again, the code was not added, so i added it in your custom.css file line1
and its working fine
kindly clear browser cache and check your site, If you need a screenshot I can share it with you as the code is working on site.
Regards
Hi,
I removed the code you added. That code makes the image smaller than the width of image holder. If you click on the photo, you will see on the next page that the image doesn't format correctly. It doesn't fit the image holder. This is the code that needs to be fix.
Hi
This is different page as compared to the topic subject.
The cover pics cannot use full height because the image height are too long and it breaks the page layout if you will force to show overflow.
The only tweak is use this code in custom.css file that force the cover height to limit
.joms-focus__cover .joms-focus__cover-image > img, .joms-hcard__cover .joms-focus__cover-image > img {
max-height: 270px;
}