I'm working on a responsive web admin single page application, I'm using `Bootstrap 3` and `AngularJS 1.4.8`, I created a panel and I put a form inside that panel, I put the footer inside the form with two buttons. 

My problem is that the panel footer doesn't cover/fill the panel length.

Do I need to put the footer inside the `form` so the button could send the information or if I put the footer outside the `form` the button can send the info anyway?

I think that the problem is that I created a `<div class="col-lg-12">` 
to put the panel heading and inside this `div` I created another `<div class="col-lg-6">` to put the panel content so that's why the panel footer doesn't cover the entire panel. 

I tried putting the footer outside of the `<div class="col-lg-6">` and it worked but if do this the button will be outside of the `form`. Does this matter it seems to me like a bad practice putting the button outside of the `form`.

Here is my html code

```
<div class="row">
    <div class="col-lg-12">
        <h1 class="page-header">Create User</h1>
    </div>
    <!-- /.col-lg-12 -->
</div>
<!-- /.row -->
<div class="row">
    <div class="col-lg-12">
        <div class="panel panel-primary">
            <div class="panel-heading">
                Basic Form Elements
            </div>
            <div class="panel-body">
                <div class="row">
                    <div class="col-lg-6">
                        <form role="form">
                            <div class="form-group">
                                <label>Name:</label>
                                <input class="form-control" placeholder="user name">
                            </div>
                            <div class="form-group">
                                <label>Email:</label>
                                <input class="form-control" placeholder="email">
                            </div>
                            <div class="panel-footer clearfix">
                                <div class="pull-right">
                                    <button type="reset" class="btn btn-default">Reset</button>
                                    <button type="submit" class="btn btn-primary">Send</button>
                                </div>
                            </div>
                        </form>
                    </div>
                    <!-- /.col-lg-6 (nested) -->
                    <!-- /.col-lg-6 (nested) -->
                </div>
                <!-- /.row (nested) -->
            </div>
            <!-- /.panel-body -->
        </div>
        <!-- /.panel -->
    </div>
    <!-- /.col-lg-12 -->
</div>
<!-- /.row -->

```