Dear Kind Helpers at Enfold Support,
Could you help me fix a problem? – when I put 4 team members together (with equal height rows) it doesn’t go into responsive mode on a mobile phone and the four members are put together very tightly. See this link:
It displays perfectly on desktop, and wider screens but doesn’t go into responsive on smaller screens. I would want to display one or two team members on smaller screens so they are not squashed together.
thanks for any help,
best wishes,
Christopher Skelton.
Hey kelsangchodor,
Please, I checked your site on my mobile device and all looks normal. Can you share a screenshot of the issue?
Best regards,
John Torvik
Hi John,
Thanks for your time.
It’s when the width of the screen is 768px – the 4 columns are squashed together – is it possible for me to use some CSS to make the pictures use only two columns? and then when screen resolution is smaller, say 400px to use only on column? it currently jumps from 4 columns to 1.
Thanks for any help,
Christopher Skelton.
Hi Christopher Skelton,
Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
@media only screen and (min-width: 768px) and (max-width: 1023px){
#top .flex_column_table_cell {
float: left;
display: block;
width: 49% !important;
margin-left: 1% !important;
min-height: 555px;
}
#top .flex_column_table {
display: block;
}
}
If you need further assistance please let us know.
Best regards,
Victoria
Victoria!
You fixed it! As Homer Simpson would say, ‘Woohoo!’
Thanks for much for your time and help,
Best wishes,
Christopher Skelton.