Social Media Alignment



  • I have a added couple of social media button in a HTML footer widget but they seen not aligned

    0_1462964345117_footer.png

    this is the HTML code I placed in the widget:

    <center>
    <br></br>
    <div class="nav-container2">
    <ul>
    <li>
    <div class="fb-like" data-href="https://www.fcom/" data-layout="button_count" data-action="like" data-show-faces="false" data-share="true"></div>
    </li>
    <li>
    <a href="https:/" class="twitter-follow-button" data-show-count="false">Follow @ahlamtafsir</a>
    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
    </li>
    <li>
    <div class="g-ytsubscribe" data-channelid="UCLvfTgTD5e2y5tpqMpVnziA" data-layout="default" data-theme="dark" data-count="default" data-onytevent="onYtEvent"></div>
    </li>
    </ul>
    </div>

    <div id="fb-root"></div>

    </center>

    And This is the CSS I have added for it:

    .nav-container2 ul div {display: inline;}
    .nav-container2 li {display: inline-block; float: none;}


Log in to reply
 

Looks like your connection to NodeBB was lost, please wait while we try to reconnect.