Pricing Field Setup and CSS

You can do something similar, but it's going to require some CSS customization. I'm not sure how comfortable you are with that or not, but here's a gist of it.

I created a test form with a few fields.. using a section header field to create the "box" and then absolutely positioning the product/quantity fields and product image ( added via a HTML block ) to create the overall look you referenced.

screenshot: http://bit.ly/pyxKhm

For my sample form ( form ID #106 ) here's the CSS I used to make it happen. You would of course update this to the correct form and field ID's in your form.

[css]
/* example assumes this is form ID #106 - update your form ID and
field ID's in the rules below and tweak as needed to suit your preference */

body #gform_wrapper_106.gform_wrapper {
	position: relative
}

/* size the section header and apply a border to it for a box or container effect */

body #gform_wrapper_106.gform_wrapper .gform_body ul.gform_fields li#field_106_1.gfield.gsection {
	height: 240px;
	border: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	padding:20px 20px 20px 180px
}

/* absolutely position the product and quantity fields in the 'box' above */

body #gform_wrapper_106.gform_wrapper .gform_body ul.gform_fields li#field_106_2.gfield {
	position: absolute;
	top: 165px;
	left:180px
}
body #gform_wrapper_106.gform_wrapper .gform_body ul.gform_fields li#field_106_4.gfield {
	position: absolute;
	top: 215px;
	left:180px
}
body #gform_wrapper_106.gform_wrapper .gform_body ul.gform_fields li#field_106_3.gfield {
	position: absolute;
	top: 265px;
	left:180px
}

/* absolutely position the product image added in the HTML field */

body #gform_wrapper_106.gform_wrapper .gform_body ul.gform_fields li#field_106_8.gfield {
	position: absolute;
	top: 60px;
	left:6px
}

and just to make it easier to see how it went together, you can download my sample form ( XML ) here and import it into your Gravity Forms admin via the import tool to deconstruct.

I hope that helps point you in the right direction.

There aren't any reusable class names in my example. You would target each element by it's unique ID ( # ) and define a new rule for it.

Now, if you have a ton of these, it's going to take a while to customize everything that way. You can tinker around with creating a re-usable class name and then applying it via the form editor, but you might have to take a different approach somewhat. That's probably not going to work so well using the method I outlined.