Make grid responsive but with 2 Colums ?

By: Susan Schorstädt | Asked: 10/02/2024
ForumsCategory: General questionsMake grid responsive but with 2 Colums ?
Susan Schorstädt asked 4 days ago
Hello again :-)   I have two questions. I noticed that something was wrong in the admin backend under view -> grid style settings -> number of grid colums. If I type 5, 5 columns are shown, if I type 6, then 10 columns are shown. But my actual question is: I would like to have 5 columns in the normal desktop view, for example.
and I would like to have 2 columns instead of 1 in the mobile view, responsive. Make grid responsive, only shows 1 column, that's how it is described. is there an easy way to display 2 columns in respensive mode? I would be very happy if someone here could give me some good advice. best and kind regards susan
1 Answers
Victor Font answered 3 days ago
Yes. You can do this with your own custom CSS. 
Susan Schorstädt replied 3 days ago

But that doesn't have anything to do with the line below called custom classes?

Susan Schorstädt replied 3 days ago

.frm_grid_container andd .frm_responsive
are the classes correct?

Victor Font replied 3 days ago

<p>Those are Formidable’s built-in classes. You can override those with your own variations. It’s just CSS and it’s totally under your control. Have you ever configured CSS grid before? If not, it may be a benefit to brush up.</p>

Susan Schorstädt replied 3 days ago

Unfortunately I have no experience in this. Is it complicated to display 2 columns in responsive mode?

Susan Schorstädt replied 3 days ago

I have this code but don't work:

/* Responsive Spalten für Formidable Forms */
@media (max-width: 768px) { /* Maximalbreite für mobile Ansicht */
.frm_form_field {
width: 48%; /* Breite von 48% für jedes Feld */
display: inline-block; /* Inline-Block-Layout für die Spalten */
box-sizing: border-box; /* Padding und Border in die Gesamtbreite einbeziehen */
margin-right: 2%; /* Abstand zwischen den Spalten */
}

.frm_form_field:nth-child(2n) {
margin-right: 0; /* Kein Abstand nach der zweiten Spalte */
}
}

Making the Best WordPress Plugin even better - Together

Take on bigger projects with confidence knowing you have access to an entire community of Formidable Experts and Professionals who have your back when the going gets tough. You got this!
Join the community
crossarrow-right