Em 1 mês estou quase com 1.000 membros, mas estou faltando uma coisa!

Como vejo seu site agora, as três colunas são responsivas.

Mas se o que você quer é que as 3 colunas encolham no lugar à medida que você estreita a janela (exceto no celular, é claro), você pode tentar isto:

/* Container para segurar as 3 colunas */
#main-outlet-wrapper {
  display: flex;
  justify-content: space-between;
  gap: 20px; /* Ajuste o espaço entre as colunas, se necessário */
}

/* Cada coluna */
.sidebar-wrapper,
#main-outlet,
.custom-right-sidebar {
  flex: 1;
  padding: 10px;
  background-color: #f4f4f4; /* Fundo claro para visibilidade */
  border: 1px solid #ddd; /* Borda opcional */
  box-sizing: border-box; /* Garanta que o preenchimento seja incluído na largura */
}

@media (max-width: 768px) {
  /* Empilhe as colunas em telas menores */
  #main-outlet-wrapper {
    flex-direction: column;
  }
}

7 curtidas