Issue
I am making a simple login with bootstrap and I am having a problem dealing with this, here is my code:
<div class="container">
<div class="row justify-content-center no-gutters" style="padding-top:150px;">
<div class="col-lg-8">
<div class="card shadow-lg o-hidden border-0 my-5 mx-auto">
<div class="card-body">
<div class="row">
<div class="col-lg-6 p-0">
<div class="p-5">
<div class="text-center">
<h4 class="text-dark mb-4">Login</h4>
</div>
<form class="user">
<div class="mb-3">
<input class="form-control form-control-user" type="email" id="exampleInputEmail" aria-describedby="emailHelp" placeholder="Username" name="email">
</div>
<div class="mb-3">
<input class="form-control form-control-user" type="password" id="exampleInputPassword" placeholder="Password" name="password">
</div>
<button class="btn btn-primary d-block btn-user w-100" type="submit">Login</button>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
Can somebody help? Thank you so much!
Solution
You have used 'col-lg-6'. On large screen it contains only half width of the row. If you remove this class There won't be any extra space. You can read more about grid system
Answered By - Muhammad Naeem Tahir Answer Checked By - Robin (PHPFixing Admin)
0 Comments:
Post a Comment
Note: Only a member of this blog may post a comment.