Okay
  Public Ticket #970317
Footer Off-Center
Closed

Comments

  • MyshaSantini started the conversation

    Hello,

    On certain browser sizes and on mobile devices (in landscape) the social icons in the footer become off centered (screenshot attached)

    Is there a way to fix this so that the icons are always in the center?

    Thank you!

    Mysha

  •  3,030
    Andrew replied

    Hi Mysha,

    Thanks for contacting us regarding your query.

    You may use the following Custom CSS Code to accomplish this request. 

    /* Centers Footer On Mobile Viewport */
    @media (max-width:991px){  
    #footer-outer #copyright .container div:last-child{
      position: relative !important;
      right: 20% !important;
    }
    }
    /* Centers Footer On Mobile Viewport */ 
    @media (max-width:690px){  
    #footer-outer #copyright .container div:last-child{
      position: relative !important;
      left: 35% !important;
    }
    }
    

    You may add this to the Custom CSS Code section located by navigating to Appearance>General Settings>CSS/Script Related>Custom CSS Code from your WordPress Dashboard

    Please let me know if there are any more questions that I may answer for you

    Cheers! 

  • MyshaSantini replied

    Hello,

    This has fixed the footer on landscape on mobile devices but has now off centered it when the device is portrait!

    (Screenshot attached)


    Thank you!

    -Mysha

  •  3,030
    Andrew replied

    Hi Mysha,

    Could you try and disable the following code on the salient options:

    body #footer-outer #copyright .col ul {
        float: none!important;
    }
    

    It seems to be the cause of the misalignment issues but if does not work give us temporary admin access so that we can make sure the CSS works and fix this in the best possible way.

    Thanks.

  •   MyshaSantini replied privately
  •  3,030
    Andrew replied

    Hi Mysha,

    We would prefer a separate pair of username password that you can delete after we are done.

    Thanks.

  •   MyshaSantini replied privately
  •  3,030
    Andrew replied

    Hi Mysha,

    We logged in and modified the CSS to this:

    /* Centers Footer On Mobile Viewport */
    @media  (min-width:91px) and (max-width:991px){  
    #footer-outer #copyright .container div:last-child{
      position: relative !important;
      right: 20% !important;
    }
    }
    /* Centers Footer On Mobile Viewport */ 
    @media (max-width:690px){  
    #footer-outer #copyright .container div:last-child{
      position: relative !important;
      left:0% !important;
    }
    }
    

    That seems to work for a wider range of screens.

    Hope this helps.

  • MyshaSantini replied

    Thank you,

    This worked perfectly!

    For some reason it's still off center on landscape on an iPhone, but I'm not too worried about this!

    Thank you,

    Mysha!