Widget CSS layout

You just need to remove the bottom borders from the list items inside the form structure, then target the inputs by their unique ID and apply a few padding/margin rules so they're consistent with the adjacent form.

[css]
body .gform_widget .gform_wrapper ul li {
    border: none;
}

body .gform_wrapper input#input_4_3 {
    padding: 6px!important;
    margin: 5px 3px 0 0!important;
}

body .gform_wrapper .gform_footer input#gform_submit_button_4 {
    padding: 6px 6px 5px 6px!important;
    margin: 5px 3px 0 0!important;
}

test screenshot: http://bit.ly/ntSilq

http://www.gravityhelp.com/documentation/page/CSS_Targeting_Samples

Your rule is wrong. You're targeting the ID as if it were a class name..

you have

[css]
body .gform_wrapper_4 input#input_4_3 {
    padding: 6px!important;
    margin: 5px 3px 0 0!important;
}

which is wrong with the . (dot)

It should be

[css]
body #gform_wrapper_4 input#input_4_3 {
    padding: 6px!important;
    margin: 5px 3px 0 0!important;
}

with the # (pound) sign to denote and ID/name instead of a class. It's a small thing, but it makes all the difference.

Try setting your form that you're using for the widget back to the "top label" option. Then, you can do this to hide the field label.

[css]
body #gform-wrapper_4 li#field_4_3 label.gfield_label {
    display: none;
}

the left label option that you're using now is still applying a 29% width to the label element thats there, even thought the tag is empty.