Detalle — reparto de ancho de columnas distinto al de Concorde

17 jul 2026

Producción· 3 capturas

Producción — Detalle — reparto de ancho de columnas distinto al de Concorde (1)

Concorde

Qué está mal

En Producción la columna izquierda (galería) es ~10px más ancha y la derecha (participación) ~10px más angosta de lo que deberían.

El reparto correcto es el de Concorde: izquierda con 10px menos y derecha con 10px más.

Cómo se corrige

Ajustar el grid para restar 10px a la columna izquierda y sumárselos a la derecha.

En Concorde el reparto ya deja la izquierda −10px y la derecha +10px respecto a Producción.

Código producción

// PROD — grid con fracciones fluidas 3fr / 2fr
<div className="grid grid-cols-1 gap-3
                md:grid-cols-[minmax(0,3fr)_minmax(0,2fr)]
                md:items-start">
  <div className="md:col-start-1">…galería (izquierda)…</div>
  <div>…participación (derecha)…</div>
</div>
// las fracciones no dan 443/311 → izquierda ~10px de más, derecha ~10px de menos

Código Concorde

ver código Concorde

// Concorde — columnas con ANCHO FIJO: izquierda 443px, derecha 311px
<div style={{ display: "flex", alignItems: "flex-start", gap: 16 }}>
  <div style={{ display: "flex", flexDirection: "column", gap: 16, width: 443 }}>
    {/* galería (AuctionStatus + CardViewer + accordions) */}
  </div>
  <div style={{ display: "flex", flexDirection: "column", gap: 16, width: 311 }}>
    {/* participación (DetailCard + pills + banner) */}
  </div>
</div>
// 443 / 311 fijos → izquierda −10px y derecha +10px respecto a PROD