AngularJS - Vertical Centering

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.13/angular.js"></script>
<div ng-app="MyApp">
    <div>
        <form name="MyForm" ng-controller="TopLevel">
            <input type="text" name="field1" size="40" ng-model="field1.value" ng-required="true" /><br />
            <input type="text" name="field2" size="40" ng-model="field2.value" ng-required="false" /><br />
            <input type="email" name="field3" size="40" ng-model="field3.value" ng-required="true" /><br />
            <a href="" ng-click="doValidate(MyForm)">Click Me</a>
            
            <div class="spacer-large">
                <b>Field Data:</b><br /><br />
                <div class="field-area">
                    <label>{{ field1.label }}:</label>"{{ field1.value }}" - V[{{ MyForm.field1.$valid }}]<br />
                    <label>{{ field2.label }}:</label>"{{ field2.value }}" - V[{{ MyForm.field2.$valid }}]<br />
                    <label>{{ field3.label }}:</label>"{{ field3.value }}" - V[{{ MyForm.field3.$valid }}]<br /><br />
                    <label>Overall Form:</label> D[{{ MyForm.$dirty }}], P[{{ MyForm.$pristine }}], V[{{ MyForm.$valid }}]
                </div>
            </div>
            <div class="spacer-large">
                <b>Form JSON:</b><br ><br />
                <pre class="json-out">
                    {{ MyForm | json }}
                </pre>
            </div>
        </form>
    </div>
</div>

CSS

body {
    margin-top: 10px;
    margin-left: 10px;
    font-size: small;
    font-family: sans-serif;
}
label {
    display: block;
    width: 100px;
    float: left;
    vertical-align: middle;
    text-align: right;
    margin-right: 10px;
    color: #4072B4;
}
input {
    margin-bottom: 2px;
}
.spacer-large {
    margin-top: 25px;
}
.field-area {
    margin-left: 10px;
}
.json-out {
    margin-left: 25px;
}

JavaScript

angular.module('ui.filters', []);
angular.module('ui.directives', []);
angular.module('ui', [
    'ui.filters',
    'ui.directives']).value('ui.config', {});

angular.module('MyApp', ['ui.directives'])

.controller('TopLevel', function ($scope) {
    $scope.field1 = {label: 'Field 1', value: 'My Spoon is Too Big'};
    $scope.field2 = {label: 'Field 2', value: 'I am a banana!'};
    $scope.field3 = {label: 'Field 3', value: 'queen.of@france.com'};
    
    $scope.doValidate = function (myForm) {
        var formValid = myForm.$valid;
        if (!formValid) {
            angular.forEach(myForm, function (value) {
                if (value && value.hasOwnProperty('$modelValue') && !value.$valid) {
                    console.log(value);
                    console.log($scope[value.$name]);
                    alert('Field "' + $scope[value.$name].label + '" is invalid.');
                }
            });
        }
        return formValid;
    };
});

;