Help with CSS styling of shared items in main feed

Hi All,

I'm wondering if anyone could help me with CSS styling for shared items in the main feed of JomSocial.

Currently, the thumbnails are very small, and the description only covers half the available space.

I would like the thumbs to be larger on full-sized screens, and the description to extend to the full extent of the share box.

They currently look like this:

I would like them to look like this:

I have tried to get the CSS to do this, but unfortunately I've not been successful. Any help would be greatly appreciated.

Thank you!

Todd

Hi Todd,

I added this custom CSS code:

@media only screen and (min-width: 481px){
.joms-media--video, .joms-media--album {
  max-width: 100% !important;
}
}

pls clear cache in server side to see the change.

Regards

Hi Saguaros,

I've turned caching off (as per my other thread re the logout button), but the feed cards are still showing as they do by default.

I've turned caching off everywhere I could find it for now, so not sure if it's still a caching issue or if something else is wonky.

You can try to clear all browser's caches too, as I can see it's showing in full width now:

The feed is showing full width now, but the thumbs are still tiny.

I have added:

@media only screen and (min-width: 481px) .joms-media__thumbnail { width: 40%; height: auto; }

But nothing seems to take. I've turned off all global caching with my host and have deleted all caches I can find on the site.

I dunno. I'm stumped.

toddjharrison73 You can specify the width for it:

@media only screen and (min-width: 481px) {
.joms-media__thumbnail {
width: 300px !important;
height: auto !important;
}
}