960 Grid issues with nesting grids within other grids

Question

On our site we have just started using the grid system and we are in the process of designing a plugin for creating an account. The grid system works if I use it incorrectly however we need it to work properly. Here is the code, the work is being done on a localhost, so unfortunately I don't have a live link.

<div class="container_16 iti-wordpress">
    <div class="grid_16 stroke alpha omega">
        <h2 class="box-header"><?php _e("Account Creation", "iti-wordpress-signup"); ?></h2>
        <div class="box-body clearfix">
            <div class="grid_16 prefix_1 suffix_1 alpha omega">
                <form action="?action=check_account" enctype="multipart/form-data" method="post" name="iti-wordpress-signup" id="signup_form">
                    <div class="form_field_group mb10">
                        <h3><?php _e("Create a new account today", "iti-wordpress-signup"); ?></h3>
                        <p><?php _e("Enter birthdate below", "iti-wordpress-signup"); ?></p>
                        <div class="form_field small mb10">
                            <label for="signup_dob"><?php _e("Date of Birth", "iti-wordpress-signup"); ?></label>
                            <input class="input_text input_date" type="text" name="signup[dob]" id="signup_dob" />
                        </div>
                        <div class="form_field small inline">
                            <label for="signup_firstname"><?php _e("First Name", "iti-wordpress-signup"); ?></label>
                            <input class="input_text" type="text" name="signup[firstname]" id="signup_firstname" />
                        </div>
                        <div class="form_field small inline">
                            <label for="signup_surname"><?php _e("Last Name", "iti-wordpress-signup"); ?></label>
                            <input class="input_text" type="text" name="signup[surname]" id="signup_surname" />
                        </div>
                        <p class="clearfix">
                            <input class="flat-button right medium-width" type="submit" value="<?php _e("Submit", "iti-wordpress-signup"); ?>" />
                        </p>
                        <div class="clearfix"></div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

What is happening is that the grid_14 is supposed to be 820 and instead it is shrinking when I use the prefix_1 and suffix_1. Does anyone have any ideas as to why this is happening? This is a mix of CSS, HTML and PHP. The grid 14 is there but the suffix and prefix are pulling into the grid 14 instead of allowing the grid_14 to float within in the 940px grid 16 declared before it.