수평 폼 요소

양식을 설명했지만 거기에있는 모든 요소는 이전 요소 아래에 있습니다. 모든 요소가 가로로 배치되지만 세로로 배치되지 않는 양식을 설명해야합니다. 이것은 내 형태입니다.

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;
}

의 노드 모듈에서 사용하는 다음 코드와 유사한 코드를 사용할 수 있습니다 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',
  );

핵심은 "#attributes"속성을 "container-inline"으로 설정합니다.

이 코드는 Drupal 7 용입니다. Drupal 6의 해당 코드는 다음 코드로 시작합니다.

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

Drupal 6을 사용한다고 가정하면 코드를 다음과 비슷한 코드로 변경해야합니다.

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;
}

"item"양식 필드를 사용하고 있기 때문에 올바르게 렌더링되지 않으므로 설명을 인라인으로 넣지 않았습니다. 또한 설명을 표시하면 양식에 너무 많은 공간이 필요합니다. (인라인 된 설명이 더 길고 한 줄에 배치되면 어떻게 될지 상상해보십시오.)

Drupal 7이 컨테이너 인라인 요소에 추가하는 CSS 스타일은 다음과 같습니다.

/**
 * 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;
}

그것들은 system.base.css 에서 추가됩니다 .