JSFiddle - React, Tailwind, and code Playground

by rohitazad

HTML

<div class='social_icons'>          
         <span class="social_icons_user"> Not already a user? <a class="signup2" href="register.php">Sign up here!</a>  
            <ul class="social_icons_ul">
                <li><a href="http://facebook.com/Budgie.SocialDiscussion"><img src="Images/facebook.png" alt="Facebook" width="16" height="16"></a></li>        
                <li><a href="https://profiles.google.com/u/0/112265357246183728158"><img src="Images/google.png" alt="Google" width="16" height="16"></a></li>              <li><a href="http://twitter.com/Budgie_SD"><img src="Images/twitter.png" alt="Twitter" width="16" height="16"></a></li> 
            </ul>               
          </span> 

</div>

CSS

.social_icons{
        height:50px;
        width:800px;
        background-color:#10260F;
        font-size:12px;
        margin-left:auto;
        margin-right:auto;      
        margin-top:10px;
        color:#FFF;
        background-color:red;
        margin-bottom:10px;
    }
    
    .social_icons_user{     
        display:block;
        text-align:center;
        background-color:black; 
    }
    
    .social_icons_ul{       
        float:right;
    }
    
    .social_icons_ul li{
        display:inline;     
    }