Issue: On a Shopify Dawn collection page, the product grid was set to 66.111vw and centered, but the vertical filter (sidebar) couldn’t be fixed to 16.9vw without breaking the layout.
Proposed fix: Edit theme code (Online Store → Edit code → Assets/base.css). Within a desktop media query (min-width: 750px), set the vertical facets wrapper to width: 16.9vw (with left padding), and adjust the product-grid-container to width: 83.9vw with a left padding equal to the filter width. This aligns the grid while reserving space for the sidebar.
Outcome: The change worked as intended; the original poster confirmed success. A screenshot was included for reference. Status: Resolved.
Hi @larsvilhelmsson ,
May I suggest to update code these steps:
@media screen and (min-width: 750px){
body .facets-vertical .facets-wrapper {
padding-left: 3rem;
width: 16.9vw;
}
body .facets-vertical .product-grid-container {
width: 83.9vw;
padding-left: 16.9vw;
}
}
