I would like to have the Ajax popup portfolio element break to a single column at about 1200px instead of phone size which it is now. I have tried everything I have found and think of, but nothing works. On medium tablets the text column gets so narrow that reading is very hard and people will just close the page.
How can I set the mobile breakpoint to one column for the Ajax popup element to 1200px starting at medium tablet width? So that the image is above the text on devices smaller than 1200px,
Hey blaircomm1,
Thank you for the inquiry.
Are you referring to the Portfolio AJAX preview shown in the following demo?
// https://kriesi.at/themes/enfold/portfolio/portfolio-ajax/
You can adjust the preview containers (image, content) and make them fullwidth using this css code.
@media only screen and (max-width: 1200px) {
/* Add your Mobile Styles here */
.responsive .portfolio-preview-image, .responsive .portfolio-preview-content {
display: block;
width: 100%;
border-right: none;
}
.responsive .ajax_slide .av_table_col {
display: block;
padding: 30px;
}
}
Please make sure to toggle or temporarily disable the Enfold > Performance > File Compression settings after adding the css.
Best regards,
Ismael