Per come vedo il tuo sito in questo momento, le tre colonne sono responsive.
Ma se quello che vuoi è che le 3 colonne si riducano sul posto mentre restringi la finestra (tranne ovviamente su mobile), potresti provare questo:
/* Contenitore per contenere le 3 colonne */
#main-outlet-wrapper {
display: flex;
justify-content: space-between;
gap: 20px; /* Regola lo spazio tra le colonne se necessario */
}
/* Ogni colonna */
.sidebar-wrapper,
#main-outlet,
.custom-right-sidebar {
flex: 1;
padding: 10px;
background-color: #f4f4f4; /* Sfondo chiaro per visibilità */
border: 1px solid #ddd; /* Bordo opzionale */
box-sizing: border-box; /* Assicura che il padding sia incluso nella larghezza */
}
@media (max-width: 768px) {
/* Impila le colonne su schermi più piccoli */
#main-outlet-wrapper {
flex-direction: column;
}
}