KRAVEVIP Posted April 9 Share Posted April 9 Hey all! Posting this up here as I have no idea what to edit in order to achieve the result of what Im looking for. I want to add a border around my item title, description, color and size. How can I do this? Please find attached a photo that I edited in photoshop on what I am trying to do. Thanks in advance! Link to comment
Beyondspace Posted April 9 Share Posted April 9 14 minutes ago, KRAVEVIP said: Hey all! Posting this up here as I have no idea what to edit in order to achieve the result of what Im looking for. I want to add a border around my item title, description, color and size. How can I do this? Please find attached a photo that I edited in photoshop on what I am trying to do. Thanks in advance! Can you share your URL so I can take a look? BeyondSpace - Squarespace Website Developer 🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox) 🗓️ Delivery Date Picker (Squarespace Date picker form field) 💫 Gallery block 7.1 workaround 🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations) 🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates) If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you! Link to comment
KRAVEVIP Posted April 11 Author Share Posted April 11 On 4/9/2024 at 3:31 PM, Beyondspace said: Can you share your URL so I can take a look? Hey! So sorry, I completely forgot to add that for whatever reason. URL is https://kravevip.com.au Thanks! Link to comment
Solution Beyondspace Posted April 11 Solution Share Posted April 11 1 hour ago, KRAVEVIP said: Hey! So sorry, I completely forgot to add that for whatever reason. URL is https://kravevip.com.au Thanks! You can try the following Css Code /*Border style for product detail*/ .product-details.ProductItem-details { --border-size: 2px; } .ProductItem .ProductItem-details h1.ProductItem-details-title { border: var(--border-size) solid; margin-bottom: 0; padding: 15px; } .ProductItem-details .ProductItem-details-checkout { border: var(--border-size) solid; } .ProductItem-details-excerpt { border-bottom: var(--border-size) solid; } .ProductItem-details-checkout > div{ padding-left: 15px; padding-right: 15px; box-sizing: border-box; } Let me know how it works on your site BeyondSpace - Squarespace Website Developer 🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox) 🗓️ Delivery Date Picker (Squarespace Date picker form field) 💫 Gallery block 7.1 workaround 🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations) 🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates) If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you! Link to comment
KRAVEVIP Posted April 11 Author Share Posted April 11 7 minutes ago, Beyondspace said: You can try the following Css Code /*Border style for product detail*/ .product-details.ProductItem-details { --border-size: 2px; } .ProductItem .ProductItem-details h1.ProductItem-details-title { border: var(--border-size) solid; margin-bottom: 0; padding: 15px; } .ProductItem-details .ProductItem-details-checkout { border: var(--border-size) solid; } .ProductItem-details-excerpt { border-bottom: var(--border-size) solid; } .ProductItem-details-checkout > div{ padding-left: 15px; padding-right: 15px; box-sizing: border-box; } Let me know how it works on your site Hey! Thanks so much, this was what i needed! Made my own few little edits, but it works the way I wanted! Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment