A Drupal form custom HTML DIV CSS wrapper example

Drupal form custom HTML FAQ: How can I wrap some custom HTML around a Drupal form, like placing a wrapper DIV tag around my form so I can add some custom CSS to style my form/div?

You can wrap an HTML DIV tag around your Drupal form by using the form prefix and suffix properties, like this:

$form['#prefix'] = '<div class="my-form-class">';
$form['#suffix'] = '</div>';

You can do this anywhere in your Drupal form builder function, so a larger part of your Drupal form builder function might look like this:

# an html textfield for our drupal form
$form['name'] = array(
  '#type' => 'textfield',
  '#title' => t('First Name'),
);

# the drupal form prefix and suffix properties
$form['#prefix'] = '<div class="my-form-class">';
$form['#suffix'] = '</div>';

This code results in this HTML DIV tag being placed immediately before your Drupal form:

<div class="my-form-class">

and the closing DIV tag being output after your Drupal form:

</div>

Of course the great thing about using these Drupal form prefix and suffix tags is that once you've put an HTML DIV tag wrapper around your Drupal form, you can style it with CSS as desired.