Các yếu tố hình thức ngang

Tôi đã mô tả biểu mẫu, nhưng mọi phần tử ở đó nằm dưới phần trước. Tôi cần mô tả hình thức mà tất cả các yếu tố sẽ được đặt theo chiều ngang nhưng không theo chiều dọc. Đây là hình thức của tôi:

function contact_register_form($form, &$form_state) {
  $form['description'] = array(
    '#type' => 'item',
    '#title' => t('Sign up to be notified when your community launches:'),
  );

  $form['email'] = array(
    '#type' => 'textfield',
    '#title' => t('Email'),
  );

  $form['submit'] = array(
    '#type' => 'submit',
    '#value' => 'Add me',
  );    

  return $form;
}

Bạn có thể sử dụng mã tương tự như mã sau, được sử dụng bởi mô-đun Node trong node_filter_form().

  // Build the 'Update options' form.
  $form['options'] = array(
    '#type' => 'fieldset', 
    '#title' => t('Update options'), 
    '#attributes' => array('class' => array('container-inline')), 
    '#access' => $admin_access,
  );

  // ...

  $form['options']['operation'] = array(
    '#type' => 'select', 
    '#title' => t('Operation'), 
    '#title_display' => 'invisible', 
    '#options' => $options, 
    '#default_value' => 'approve',
  );

Chìa khóa là cài đặt dòng thuộc tính "#attribut" thành "container-inline."

Mã đó là dành cho Drupal 7; mã tương đương cho Drupal 6 bắt đầu bằng mã sau:

  $form['options'] = array(
    '#type' => 'fieldset', 
    '#title' => t('Update options'), 
    '#prefix' => '<div class="container-inline">', 
    '#suffix' => '</div>',
  );

Giả sử bạn đang sử dụng Drupal 6, thì mã của bạn sẽ được thay đổi thành một cái gì đó tương tự như sau:

function contact_register_form($form, &$form_state) {
  $form['description'] = array(
    '#type' => 'item',
    '#title' => t('Sign up to be notified when your community launches:'),
  );

  $form['email'] = array(
    '#type' => 'textfield',
    '#title' => t('Email'),
    '#prefix' => '<div class="container-inline">', 
  );

  $form['submit'] = array(
    '#type' => 'submit',
    '#value' => 'Add me',
    '#suffix' => '</div>',
  );    

  return $form;
}

Tôi đã không đặt mô tả nội tuyến, vì nó sẽ không được hiển thị chính xác bởi vì nó đang sử dụng trường biểu mẫu "mục". Tôi cũng thấy rằng việc nội tuyến mô tả sẽ khiến biểu mẫu chiếm quá nhiều không gian. (Hãy tưởng tượng điều gì sẽ xảy ra nếu mô tả nội tuyến sẽ dài hơn và được đặt trong một dòng duy nhất.)

Các kiểu CSS mà Drupal 7 thêm vào các thành phần trong vùng chứa là như sau.

/**
 * Inline items.
 */
.container-inline div,
.container-inline label {
  display: inline;
}
/* Fieldset contents always need to be rendered as block. */
.container-inline .fieldset-wrapper {
  display: block;
}

Chúng được thêm từ system.base.css .