When looking at the responsive design of Pencil Blocks 37 horizontally, I noticed that there was an ugly design flaw here.
Again, we start at 1170px and scale down the page to 891px. What used to be two rows with three images each has now become an ugly 1X2, 1x1, 1x1 and 1x2 image formation.
Only when you reduce the page to about 533px does the responsive design return to normal.
I'm not sure if I understand the answer as I've already sent screenshots of the problem.
A 2 x 3 formation (screenshot_28) became a 1x2, 1x1, 1x1 and 1x2 image formation (screenshot_33) at a certain width (approx. 891px). So the original 2 rows became 4 rows. With gaps without pictures in between.
Hello PenciDesign,
When looking at the responsive design of Pencil Blocks 37 horizontally, I noticed that there was an ugly design flaw here.
Again, we start at 1170px and scale down the page to 891px. What used to be two rows with three images each has now become an ugly 1X2, 1x1, 1x1 and 1x2 image formation.
Only when you reduce the page to about 533px does the responsive design return to normal.
Regards,
Alexander
Attached files: Screenshot_28.jpg
Screenshot_33.jpg
Screenshot_34.jpg
Screenshot_35.jpg
Hi,
Please send me the screenshot and take note of the screen you want to show. I'll check and send you a custom CSS code.
Regards,
PenciDesign.
Hello PenciDesign,
I'm not sure if I understand the answer as I've already sent screenshots of the problem.
A 2 x 3 formation (screenshot_28) became a 1x2, 1x1, 1x1 and 1x2 image formation (screenshot_33) at a certain width (approx. 891px). So the original 2 rows became 4 rows. With gaps without pictures in between.
Regards,
Alexander
Hi,
Please go to Appearance → Customize → Custom CSS then add the following custom CSS code:
@media only screen and (max-width: 960px) {.penci-block-col-3 .penci-post-item:nth-child(3n+1) {
clear: unset;
}
}
This is a similar issue with: https://pencidesign.ticksy.com/ticket/3368001/. Please posts all the issues of the responsive in 1 ticket.
Regards,
PenciDesign.