On one page, I added a row with 2 (70 % and 30%) columns. Inside each column I added a text widget. In first widget have table – second text. I use “full weight no title page template”.
Problem: When I reduce this page to tablet size, second column stealth first column. It is possible to make, that second column earlier goes down? can i set this per CSS rules for this page only?
Hi Aivaras
The global collapse point is at Settings > Page Builder > Layout. I’m sure I can work up a row specific Custom CSS rule for you. Please, send a link so I can view the page.
Thanks 🙂
This reply has been marked as private.
Here we go 🙂 Insert the below at Appearanc e> Custom CSS:
/* Custom Page Builder Classes */
@media (max-width: 1000px) {
#main .custom-collapse .panel-grid-cell {
float: none;
margin-bottom: 35px;
padding: 0;
width: auto;
}
#main .custom-collapse .panel-grid-cell:last-of-type {
margin-bottom: 0;
}
}1. Edit any row you want this to work on, click Attributes top right and insert a CSS Row Class: custom-collapse.
2. Adjust the 1000px value to your preferred collapse point.
Works great. Thank you very much for your great effort and service 🙂
Super 🙂 Glad to hear that did the trick.
All the best.