Description of the need

There are a lot of places in core (and I need this for contrib) where a module is forced to add its own style sheet in order to make two form elements appear on the same line.

It would be nice if there was a class provided by core that all the modules could use, so the same display: inline-block; CSS code doesn't need to be individually defined, and repeated.

Examples of places in core that could benefit from this: * Link fields (title and URL fields) * Date fields (date and time fields) * Image styles (image dimensions) * more!

Proposed solution

Add the following to system.css:

.form-item-inline {
  display: inline-block;
}

This would enable the following in any instance where two or more fields should appear on the same line:

  $form['resolution']['x'] = array(
    '#type' => 'textfield',
    '#default_value' => $resolution[0],
    '#size' => 5,
    '#maxlength' => 5,
    '#field_suffix' => ' x ',
    '#wrapper_attributes' => array('class' => array('form-item-inline')),
  );
  $form['resolution']['y'] = array(
    '#type' => 'textfield',
    '#default_value' => $resolution[1],
    '#size' => 5,
    '#maxlength' => 5,
    '#field_suffix' => ' ' . t('pixels'),
    '#wrapper_attributes' => array('class' => array('form-item-inline')),
  );

Alternatives that have been considered

I think we can do something similar with the existing container-inline class, but I haven't been able to figure that out. I'll look at some more examples.

Additional information

N/A

Draft of feature description for Press Release (1 paragraph at most)

Backdrop now includes a utility class that contrib modules can use to display multiple input fields on the same line.

GitHub Issue #: 
5829