How to right align text next to icons in footer

Hey trufflesadmin,

Thanks for giving us a mockup of what you want to achieve and a link to your site.
However with the current markup/html structure it’s difficult to achieve.
Currently you have 3 divs (2 having class of rows), the 2 social icons and the first paragraph are in the same div which makes it very difficult and hard to fix on responsive versions.
Please do the following instead, Create 1 div put a class name (ex. my-custom-footer) inside it create 2 divs, one has the 2 social icons and the other has those texts.
Then in Quick CSS, try to add the following CSS code:

#top .my-custom-footer {
  display: flex;
}

You may need to define width in one for the 2 divs.
Hope this helps.

Best regards,
Nikko

Hi,

Add this to quick css:

@media only screen and (max-width: 767px){
.my-footer div:first-child,
.my-footer div:nth-child(2){
width:100%!important;
}}

Best regards,
Jordan Shannon

Hi,

Try adding this as well:

@media only screen and (max-width: 767px){
.my-footer div:nth-child(3){
margin-left:30px!important;
}}

Best regards,
Jordan Shannon

Hi D,

Can you try adding this CSS code:

@media only screen and (max-width:767px) {
  #top .my-footer {
    display: block;
  }

  #top .my-footer > div {
    width: 50% !important;
    display: block !important;
    float: left;
    text-align: left;
    padding: 8px 16px;
  }

  #top .my-footer > div:first-child {
    text-align: right;
  }

  #top .my-footer > div:last-child {
    margin-left: 0 !important;
    width: 100% !important;
  }
 
  #footer #custom_html-2 {
    padding-bottom: 60px;
  }
}

Best regards,
Nikko

Hi,

I’m glad this was resolved. If you need additional help, please let us know here in the forums.

Best regards,
Jordan Shannon