Jump to content

SolveigTraeet

Member
  • Posts

    275
  • Joined

  • Last visited

Posts posted by SolveigTraeet

  1. Site URL: https://www.queenofsol.com/pictures-videos

    Hi!

    I have a facebook social icon that has placed itself differently from the other icons. Can someone help me align the facebook icon with the other icons? I don't quite know what's happened. Thank you for your time 😃

     

    Below is my current css coding:

    //social icons in menu//
    .header-nav-folder-item.header-nav-folder-item--external
    [href="https://www.facebook.com/queenofsolmusic"] {
        background-image: url(https://static1.squarespace.com/static/5feeff4078965c3d27c09d49/t/60265cb380f5db784fb09d4f/1613126835700/Asset+311.png) !important;
        background-size: contain !important;
      background-position:center!important;
        background-repeat: no-repeat !important;
        color: transparent !important;
        margin-bottom: 5px;
    }
    .header-nav-folder-item.header-nav-folder-item--external
    [href="https://www.tiktok.com/@queenofsol"] {
        background-image: url(https://static1.squarespace.com/static/5feeff4078965c3d27c09d49/t/6026fa9218f6a5109abbd4db/1613167250612/Asset+312.png) !important;
       background-position:center!important;
        background-size: contain!important;
        background-repeat: no-repeat !important;
        color: transparent !important;
        margin-bottom: 5px;
    }
    .header-nav-folder-item.header-nav-folder-item--external
    [href="https://www.instagram.com/queenofsol"] {
        background-image: url(https://static1.squarespace.com/static/5feeff4078965c3d27c09d49/t/6026fc1c12bd686fe95c8a74/1613167644662/Asset+313.png) !important;
       background-position:center!important;
       background-size: contain!important;
        background-repeat: no-repeat !important;
        color: transparent !important;
        margin-bottom: 5px;
    }
    .header-nav-folder-item.header-nav-folder-item--external
    [href="https://twitter.com/_QueenofSol"] {
        background-image: url(https://static1.squarespace.com/static/5feeff4078965c3d27c09d49/t/6026fc59e8b20275c6da5ce0/1613167705184/Asset+314.png) !important;
       background-position:center!important;
        background-size: contain!important;
        background-repeat: no-repeat !important;
        color: transparent !important;
        margin-bottom: 5px;
    }
    .header-nav-folder-item.header-nav-folder-item--external
    [href="https://www.queenofsol.com/contact"] {
        background-image: url(https://static1.squarespace.com/static/5feeff4078965c3d27c09d49/t/6026fbd2cf13eb2323dffdb2/1613167570311/Asset+315.png) !important;
       background-position:center !important;
        background-size:contain!important;
        background-repeat: no-repeat !important;
        color: transparent !important;
        margin-bottom: 5px;
    }

    .header-nav-folder-item.header-nav-folder-item--external:last-child
     {   margin-top:3px;
       width: 100% !important;
       text-align:center;
    background-image: url() !important;
       background-position:center !important;
        background-size:contain!important;
        background-repeat: no-repeat !important;
        color: transparent !important;
        margin-bottom: 5px;}

    /* Socials icons in folder */
    .header-nav-folder-content>div:nth-child(n+6) {
        width: 20% !important;
        float: left !important;
    }
    /* Center menu social */
    .header-nav-folder-item.header-nav-folder-item--external:nth-child(6) {
        margin-left: 0% !important;
    }
     

    place Facebook symbol first, beside Tiktok, instagram, twitter and contact.jpg

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.