@kay_png after “.header{…}” above, you can add this code for backing black button:
.banner__buttons__fixed .button.button--primary {
background-color: black!important;
}
Hope this can fix your problem
Topic summary
Goal: Add a black background strip behind the main menu so it stands out, with white menu text, matching provided screenshots. Site: fabricapparel.com.
What was done:
- Advised to edit theme.liquid in Shopify and insert CSS above to style the header/menu.
- Menu strip implemented; helper verified the site looked correct via screenshot. Clarified requirement was black strip with white text.
Side effect encountered:
- After adding CSS (.header__inline-menu { background: black; } and header padding/width tweaks), the black rectangle buttons for “Wholesale” and “By the yard” disappeared.
Fix provided:
- Add extra CSS targeting the primary buttons within the banner to restore their black background (selector provided for .button.button–primary under the banner section).
Outcome:
- Requester confirmed the button fix worked. Issue resolved.
Notes:
- Multiple screenshots were central to show the desired look and the achieved result.