Support » Theme: Enigma » Phone number formating

  • Resolved dr_andy

    (@dr_andy)


    I asked this 6 months ago, and never got a reply. It’s closed for replies now, and a handful of updates have come through, but my phone number is still split in half under the social media options section.

    The phone number that displays from the Social Options on the top right of the site splits in half, putting it on 2 lines. It seems to be based off of the size of my email address. If I shorten my email address by 2 letters, everything formats correctly. Same goes for shortening my phone number by 2. My email is 24 characters long, and my phone number is 12 characters long with the “-” in it. It used to look correctly many versions ago.

    I see the issue in Chrome and Edge, but it looks fine on Safari or my Android Chrome browser. Do you think adjusting the font size css for that section 1 or 2 pts smaller might fix it?

    Issue was noticed originally with:
    WordPress version: 5.7
    Enigma version: 7.1.6
    Weblizar Companion plugin version: 1.2.91

    I am still having this issue with:
    WordPress version: 5.8.1
    Enigma version: 7.3.2
    Weblizar Companion plugin version: 1.3.4

    Thank you.

    • This topic was modified 3 months, 3 weeks ago by dr_andy.

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • @dr_andy : pls use below css in the appearance >> css editor.

    Use this css

    .head-contact-info,.head-contact-info li{
    	display: flex;
    }

    Thanks

    Thread Starter dr_andy

    (@dr_andy)

    Thank you, that fixes it on desktop view, but messes it up on phone view. This CSS on a phone doesn’t move the phone number under the email, it smooshes it off to the edge, using 3 lines next to the email, so you can’t see the numbers. Is there a way to tell the CSS you just sent me to only make the adjustment on desktop sized displays, and not use it on phone size?

    Thread Starter dr_andy

    (@dr_andy)

    Before CSS fix:
    Desktop had wrong formatting, mobile was correct

    Desktop
    email@exmple.com 123-456-
    7890

    Mobile
    email@exmple.com
    123-456-7890

    After your CSS fix:
    Desktop had correct formatting, mobile was incorrect

    Desktop
    email@exmple.com 123-456-7890

    Mobile
    email@exmple.com 123-
    456-
    7890

    Thread Starter dr_andy

    (@dr_andy)

    I think I got it. I changed the CSS you asked me to change a little bit. I changed the font from 18px to 16px.

    This seems to work for me:

    .head-contact-info,.head-contact-info li{
    	font-size:16px;
    }
Viewing 4 replies - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.