Question

我想让这两个按钮彼此相邻。有人请帮帮我

<div class="form-group has-feedback"> 
            <a href="#####" class="center-block btn btn-block btn-facebook fa fa-facebook"> Login met Facebook</a>
</div><!-- /.col --> 

<div class="form-group has-feedback"> 
            <a href="#####" class="center-block btn btn-block btn-google fa fa-google"> Login met Google</a>
</div><!-- /.col -->

How the buttons look like now!

Answer 1

您可以使用以下代码将它们彼此相邻。

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" rel="stylesheet"/>
<div class="row">
<div class="form-group has-feedback col-xs-6"> 
            <a href="https://www.facebook.com/login/reauth.php?app_id=179505256141848&signed_next=1&next=https%3A%2F%2Fwww.facebook.com%2Fv2.11%2Fdialog%2Foauth%3Fredirect_uri%3Dhttps%253A%252F%252Ftom.lbmedia.nl%252Fassets%252Fpages%252Ffb-callback.php%26state%3Da6e50a2b7bff95ee39542cbcc73f6480%26scope%3Demail%26response_type%3Dcode%26client_id%3D179505256141848%26ret%3Dlogin%26sdk%3Dphp-sdk-5.5.0%26logger_id%3D06f6cef0-0163-e9e8-202d-5f68de0a1b47&cancel_url=https%3A%2F%2Ftom.lbmedia.nl%2Fassets%2Fpages%2Ffb-callback.php%3Ferror%3Daccess_denied%26error_code%3D200%26error_description%3DPermissions%2Berror%26error_reason%3Duser_denied%26state%3Da6e50a2b7bff95ee39542cbcc73f6480%23_%3D_&display=page&locale=nl_NL&logger_id=06f6cef0-0163-e9e8-202d-5f68de0a1b47" class="center-block btn btn-block btn-facebook fa fa-facebook"> Login met Facebook</a>
</div><!-- /.col --> 

<div class="form-group has-feedback col-xs-6"> 
            <a href="https://accounts.google.com/signin/oauth/identifier?client_id=169651331790-5i2kf3kl8qkhuq919gp3lag99phsqqk1.apps.googleusercontent.com&as=6_dE2dN4AXFgJwCP7xakiA&destination=https%3A%2F%2Ftom.lbmedia.nl&approval_state=!ChR2ZGdzeFZ0SjRwd1pzekVyVU9RRxIfQXpaWDNDWXl3M2NkZ0JkUzcxNXRYREdibmx6bkdCWQ%E2%88%99ACThZt4AAAAAWoP_Awgh8JMRuv36TgmADjpePhykVJmF&xsrfsig=AHgIfE_wMxbnmxYw7mQRkWDlXGMjNfCNPg&flowName=GeneralOAuthFlow" class="center-block btn btn-block btn-google fa fa-google"> Login met Google</a>
</div><!-- /.col -->
</div>

＆＃13;

Answer 2

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" />
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet">
<div class="container-fluid">
  
<div class="row">
<center>
  <div class="col-md-3 col-sm-3 col-xs-3">
 </div>
<div class="col-md-3 col-sm-3 col-xs-3">    

            <a href="https://www.facebook.com/login/reauth.php?app_id=179505256141848&signed_next=1&next=https%3A%2F%2Fwww.facebook.com%2Fv2.11%2Fdialog%2Foauth%3Fredirect_uri%3Dhttps%253A%252F%252Ftom.lbmedia.nl%252Fassets%252Fpages%252Ffb-callback.php%26state%3Da6e50a2b7bff95ee39542cbcc73f6480%26scope%3Demail%26response_type%3Dcode%26client_id%3D179505256141848%26ret%3Dlogin%26sdk%3Dphp-sdk-5.5.0%26logger_id%3D06f6cef0-0163-e9e8-202d-5f68de0a1b47&cancel_url=https%3A%2F%2Ftom.lbmedia.nl%2Fassets%2Fpages%2Ffb-callback.php%3Ferror%3Daccess_denied%26error_code%3D200%26error_description%3DPermissions%2Berror%26error_reason%3Duser_denied%26state%3Da6e50a2b7bff95ee39542cbcc73f6480%23_%3D_&display=page&locale=nl_NL&logger_id=06f6cef0-0163-e9e8-202d-5f68de0a1b47" class="btn btn-facebook fa fa-facebook"> Login met Facebook</a>
</div>
 <div class="col-md-3 col-sm-3 col-xs-3">
            <a href="https://accounts.google.com/signin/oauth/identifier?client_id=169651331790-5i2kf3kl8qkhuq919gp3lag99phsqqk1.apps.googleusercontent.com&as=6_dE2dN4AXFgJwCP7xakiA&destination=https%3A%2F%2Ftom.lbmedia.nl&approval_state=!ChR2ZGdzeFZ0SjRwd1pzekVyVU9RRxIfQXpaWDNDWXl3M2NkZ0JkUzcxNXRYREdibmx6bkdCWQ%E2%88%99ACThZt4AAAAAWoP_Awgh8JMRuv36TgmADjpePhykVJmF&xsrfsig=AHgIfE_wMxbnmxYw7mQRkWDlXGMjNfCNPg&flowName=GeneralOAuthFlow" class="btn btn-google fa fa-google"> Login met Google</a>
</div><!-- /.col -->
<div class="col-md-3 col-sm-3 col-xs-3"></div>
</div>
</center>
</div>

</div>

＆＃13;

Answer 3

只需这样做：

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" >
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<div class="form-group has-feedback text-center">
  <a href="#####" class="btn  btn-facebook fa fa-facebook"> Login met Facebook</a>
  <a href="#####" class="btn btn-google fa fa-google"> Login met Google</a>
</div>
<!-- /.col -->

Bootstrap 3.3.5 - 让2个按钮彼此相邻

3 个答案: