IMPACT Posted March 8, 2021 Share Posted March 8, 2021 Site URL: https://www.impactpa.church/ Hello! On my website I'm trying to bold the first item in the navigation bar to make it more noticeable. I haven't had any luck so far with some things I've found online. I've tried this: .Header-nav--primary .Header-nav-item:first-child{ font-weight: 700 } and have also set it font-weight equal to bold, but I'm not seeing any changes. Any help is appreciated! Link to comment
Solution ErikaT Posted March 8, 2021 Solution Share Posted March 8, 2021 Hi, Try: .header-nav-item:nth-child(1) { font-weight: 700; } IMPACT 1 Link to comment
IMPACT Posted March 9, 2021 Author Share Posted March 9, 2021 On 3/8/2021 at 3:16 PM, ErikaT said: Hi, Try: .header-nav-item:nth-child(1) { font-weight: 700; } Worked like a charm, thank you! Link to comment
IMPACT Posted March 11, 2021 Author Share Posted March 11, 2021 Would you know how to change the color of it? .header-nav-item:nth-child(1) { font-weight: 1000; color: #5c4255; } I tried setting it like this but nothing is changing. Link to comment
ErikaT Posted March 11, 2021 Share Posted March 11, 2021 Hi there 🙂 You could try: .header-nav-item a[href="/easter"], .header-menu-nav-item a[href="/easter"]  {   color: #5c4255 !important; } IMPACT 1 Link to comment
ErikaT Posted March 11, 2021 Share Posted March 11, 2021 You could also get rid of the earlier css to cut down on multiple entries and combine them: .header-nav-item a[href="/easter"], .header-menu-nav-item a[href="/easter"] { Â Â color: #5c4255 !important;Â Â Â font-weight: 1000; } IMPACT 1 Link to comment
IMPACT Posted March 12, 2021 Author Share Posted March 12, 2021 Thanks again, it's working great! Link to comment
tuanphan Posted March 21, 2021 Share Posted March 21, 2021 On 3/12/2021 at 8:15 AM, IMPACT said: Thanks again, it's working great! Do you want to align left or right or center all elements in footer mobile? You can use this CSS /* Center footer mobile */ @media screen and (max-width:767px) { div#page-section-5f3191439aec11022b6c195a * { text-align: center !important; } } ON tablet, the footer doesn't look good. Do you want to decrease text size, increase columns width? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
IMPACT Posted April 27, 2021 Author Share Posted April 27, 2021 What would be your recommendation for it? Link to comment
tuanphan Posted April 28, 2021 Share Posted April 28, 2021 21 hours ago, IMPACT said: What would be your recommendation for it? Hi. Which problem? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
IMPACT Posted April 28, 2021 Author Share Posted April 28, 2021 6 hours ago, tuanphan said: Hi. Which problem? For the last part where you mentioned it not looking good on tablet. Link to comment
tuanphan Posted April 29, 2021 Share Posted April 29, 2021 20 hours ago, IMPACT said: For the last part where you mentioned it not looking good on tablet. Remove logo on tablet only. What do you think? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
IMPACT Posted April 30, 2021 Author Share Posted April 30, 2021 On 4/29/2021 at 10:29 AM, tuanphan said: Remove logo on tablet only. What do you think? That would work! How do I do that? Link to comment
tuanphan Posted May 1, 2021 Share Posted May 1, 2021 17 hours ago, IMPACT said: That would work! How do I do that? Add to Design > Custom CSS /* tablet footer */ @media screen and (max-width:991px) and (min-width:768px) { div#page-section-5f3191439aec11022b6c195a .span-12>.row>.span-4 { display: none; } div#page-section-5f3191439aec11022b6c195a .span-12>.row>.span-8 { width: 100%; } }  IMPACT 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Yaraf Posted September 8, 2021 Share Posted September 8, 2021 Hello I applied this code to change one element color on the phone menu but it's also changing the same item on desktop. Any idea how to solve this? Link to comment
tuanphan Posted September 12, 2021 Share Posted September 12, 2021 On 9/8/2021 at 8:26 PM, Yaraf said: Hello I applied this code to change one element color on the phone menu but it's also changing the same item on desktop. Any idea how to solve this? Hi, What is your site url? We can check easier Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Yaraf Posted September 13, 2021 Share Posted September 13, 2021 Hello, Thank you I solved this using custom css (breakpoints and page links) Link to comment
Ecold Posted March 10, 2022 Share Posted March 10, 2022 On 3/8/2021 at 8:16 PM, ErikaT said: Hi, Try: .header-nav-item:nth-child(1) { font-weight: 700; } Hiya, sorry i've just seen this code and it worked on my website computer screen but I forgot how to write code so it transitions to mobile version too.. do you know how I can make the bold text seen on both versions please? Thanks (www.cobbledstreetshop.co.uk)Â Link to comment
tuanphan Posted March 13, 2022 Share Posted March 13, 2022 On 3/11/2022 at 2:29 AM, Ecold said: Hiya, sorry i've just seen this code and it worked on my website computer screen but I forgot how to write code so it transitions to mobile version too.. do you know how I can make the bold text seen on both versions please? Thanks (www.cobbledstreetshop.co.uk) Mobile needs this code .header-menu-nav-folder[data-folder="root"]>div>div:nth-child(1) a { font-weight: 700; }  Ecold 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Dstv Posted November 10, 2022 Share Posted November 10, 2022 Hi there! I'd like to bold my store menu at vpicervico.com Any chance you can help me out? Many thanks. Link to comment
tuanphan Posted November 13, 2022 Share Posted November 13, 2022 On 11/11/2022 at 2:28 AM, Dstv said: Hi there! I'd like to bold my store menu at vpicervico.com Any chance you can help me out? Many thanks. Use this CSS div.header-nav-item:nth-child(1)>a { font-weight: bold; } .header-menu-nav-folder[data-folder="root"]>div>div:nth-child(1) a { font-weight: bold; }  Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care 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