ggimishev Posted January 17 Share Posted January 17 (edited) Hello all, this is my contact form - https://www.wolk.studio/contact As you can see the CSS does not effect the (required) font size and the captions for some strange reason. Here is the current CSS: //CONTACT FORM // For the Form @font-face {font-family:TabletGothic; src:url(https://static1.squarespace.com/static/65a4f0d085c986465cc1e281/t/65a7d0831d1fbf08554873ab/1705496707549/Tablet+Gothic+Compressed+W02Th.ttf) } .form-wrapper .field-list .title { font-family: TradeGothic; font-size: 5px; color: #000000; letter-spacing: .10em; text-transform: none; } .form-wrapper .field-list .description { font-family: TradeGothic; font-size: 5px; color: #000; letter-spacing: .1em; text-transform: none; } .form-wrapper .field-list .field .caption { font-size:5px; font-family:'TradeGothic'; color:none; } I am want to make it look like this one Thank you in advance. Edited January 17 by ggimishev Link to comment
melody495 Posted January 17 Share Posted January 17 Hi @ggimishev 1st thing I notice is that your font-family names are not the same. In @font-face where you have loaded your font file, you called it TabletGothic. In the following CSS, you called it TradeGothic. Try aligning those and see if it helps. I have a guide on Top 5 reasons why custom font is not working in SquareSpace. Not matching font-family is #1. If that doesn't work, try working through the rest of the guide to see if it helps. Let me know how it goes. -------- > 👆 <---------- Please quote or @ me when replying, or I won't get a notification Melody | Squarespace Nerd e: melody@melodylee.tech 💻 💁♀️ 1-2-1 Squarespace Training session <- feeling stuck and want to learn? 👩💻 💁♀️ Website help <- send me your to-do list. From code to plugin to domain setup. 🧰 See the tools I use (contain affiliate links) ☕ Did I help? I like coffee (Thank you) Link to comment
ggimishev Posted January 17 Author Share Posted January 17 4 hours ago, melody495 said: Hi @ggimishev 1st thing I notice is that your font-family names are not the same. In @font-face where you have loaded your font file, you called it TabletGothic. In the following CSS, you called it TradeGothic. Try aligning those and see if it helps. I have a guide on Top 5 reasons why custom font is not working in SquareSpace. Not matching font-family is #1. If that doesn't work, try working through the rest of the guide to see if it helps. Let me know how it goes. Hello @melody495, not the font family name is the problem. The resizing of the font also does not work. It must be something with the CSS selector idk. Link to comment
melody495 Posted January 18 Share Posted January 18 12 hours ago, ggimishev said: It must be something with the CSS selector idk. You are right. You can check the CSS selector from the Inspect tool. Here is what I see for your contact form. You have selectors for .form-wrapper and .field-list, then you need to target relevant ones to apply your CSS styling to. I have highlighted the ones that you seem to want to target. -------- > 👆 <---------- Please quote or @ me when replying, or I won't get a notification Melody | Squarespace Nerd e: melody@melodylee.tech 💻 💁♀️ 1-2-1 Squarespace Training session <- feeling stuck and want to learn? 👩💻 💁♀️ Website help <- send me your to-do list. From code to plugin to domain setup. 🧰 See the tools I use (contain affiliate links) ☕ Did I help? I like coffee (Thank you) 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