List member in a row on mobile

Hi,

1. If you refer to plugin’s documentation you will see that minimum width of member thumbnail/tile is 200px (due to design limitations, for example we have text with person name and subtitle inside thumbnail)

2. Let’s assume that your theme’s/site’s content container takes full browser window width, but with 20px pudding (CSS term) from both left and ride sides.

3. Let’s take for example iPhone 6 (normal one, not Plus version). Its CSS resolution (not physical, but in CSS pixels) is 357×667 in portrait mode.
Since minimum width of member thumbnail/tile is 200px we can’t put even 2 member side by side.

4. Now let’s rotate the iPhone to landscape mode of view. Now its CSS resolution is 667×357.
667 – 20px – 20px (left and right padding inside your site container) = 627px.
Next, if we assign 200px value to member thumbnail min-width parameter in shortcode and 30px value to space between them parameter, we will be able to fit 2 members in row inside the site container.
627px – 200px – 200px – 30px

So basically whether you can or can’t fit a few members in a row, depends on container in which put them (and its CSS paddings / margins), and on thumbnail min width setting and on space between them setting.

Again, please refer to documentation .

Here is the screenshot from plugin demo, I use Chrome’s mobile “simulation” and iPhone 6 dimensions, landscape mode, and there are 2 members in one row – https://drive.google.com/open?id=0B7MsQl3Tj-lwOTY4THJkaXRvVW8
(Their min width parameter in demo is 250px.)

• This reply was modified 7 years, 3 months ago by Oleg Goltsev.
• This reply was modified 7 years, 3 months ago by Kathryn Presner.