Hi there, I am trying to improve the look on mobile, and especially the members directory.

I am using this css to decrease the overall margin in all pages for a wider look on mobile.

@media only screen and (max-width: 500px)
.site-content {
margin-right: -20px; !important;
margin-left: -20px; !important;
}

I have a two columns layout members directory but the content in each profile block, especially the x-profile fields with user information, are long and narrow, with broken words as result.

The inspector reveals a left margin of 37.313px

https://imgur.com/a/nZGayzs

I am trying to reduce this margin by using this selector, ‘bph_xprofile_fields’, with no luck.

Also the avatars reduces in size even if there are space for the default size.

How do I exploit the space better, with less white space in the blocks?

Regards
Carsten