.collection-list__container{
background-color:#f7fbfd;
padding-top: 0.5px;
width: 100%;
I am trying to do this, but it doesn’t work.
Topic summary
A user is attempting to make a background color extend full width in the Empire theme, sharing a screenshot and reversed CSS code snippet.
Proposed Solutions:
Multiple app support teams (PageFly, GemPages) and a community member offered similar approaches:
- Location: Add custom CSS to either
theme.cssortheme.liquidfile via Online Store → Theme → Edit code - Target: The CSS targets
.collection-list__containeror specific section IDs withbackground-color: #7fbfdfandwidth: 100% - Implementation: Code should be placed at the bottom of
theme.cssor before the closing</body>tag intheme.liquid
Note: Several responses contain reversed/garbled text in the original posts, making some code snippets difficult to verify. The core solution involves applying full-width background styling to collection list containers through custom CSS.
Hi @JMUDental
This is Victor from PageFly - Landing Page Builder App
You can try this code by following these steps:
Step 1: Go to Online Store->Theme->Edit code.
Step 2: Search file theme.css.
Step 3: Paste the below code at bottom of the file → Save
div#shopify-section-template--16720725672179__dynamic_collection_list {
background: #f7fbfd !important;
}
Hope that my solution works for you.
Best regards,
Victor | PageFly
Hello @JMUDental
It’s GemPages support team and glad to support you today.
You can follow these steps:
- Go to Online Store->Theme->Edit code
- Open your theme.liquid file, paste the below code before
I hope the above is useful to you.
Kind & Best regards,
GemPages Support Team
@JMUDental put below css into theme.liquid file before closing tag