Bring emphasis and customization to your Squarespace header by changing any navigation link to a custom image with this CSS hack!
Original post:
ajmexperience.com/learn-posts/change-navigation-link-to-image-in-squarespace
For more Squarespace tips to enhance your website designs, check out the rest of the learn series:
ajmexperience.com/learn
Get our free CSS Selector Cheat Sheet:
www.ajmexperience.com/css-cheat-sheet
Get our full CSS Library:
www.ajmexperience.com/squarespace-css-library
------
Note! the PNG used in the video is 400px X 100px
HERE'S THE CSS:
// desktop //
/* adjust child number as needed */
.header-nav-item:nth-child(2) a {
background-image: url("IMAGE-URL");
background-size: contain;...