I used this to align the elements inside of a mobile footer. The link name is on the left, a button is on the right.

footer-link-elements

@media only screen and (min-width: 1px) and (max-width: 479px) { 
  #footer { text-align: left; }
  #footer ul li { 
    display: table;
    table-layout: fixed;
    width: 100%;
    padding: 12px; 
  }
  #footer ul li a span {
    display: table-cell;
    vertical-align: middle;
  } 
  #footer ul li a span:first-of-type { width: 96%; }
  #footer ul li a span:nth-of-type(2) {
    width: 4%;
    padding: 6px 14px;
    background-color: rgb(202, 0,0 );
    border-radius:2px;
    text-align:center;
  }
  #footer div.inner p {margin-left: 12px;}
}  

@media only screen and (min-width: 480px) { 
  #footer { text-align: center; }
  #footer ul li { display: inline; }
  #footer ul li:not(:last-of-type) { margin-right: 12px }
  #footer ul li a span:nth-of-type(2) { display: none; }
}