水平对齐多个表单输入答案

【问题标题】：Align multiple form inputs horizontally水平对齐多个表单输入
【发布时间】：2019-10-05 19:02:05
【问题描述】：

我有一个带有 collectionType 字段的表单，该字段有 3 个输入，我想将所有 3 个输入水平对齐。在 Symfony 中可以做到这一点吗？

另外：是否可以为 collectionType 中的每个元素选择标签？

这是我的表格：

class WorkerType extends AbstractType
{
    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder
            ->add('Firstname')
            ->add('Lastname')
            ->add('tasks', CollectionType::class, [
                'label'        => 'Tasks',
                'entry_type'   => TasksType::class,
                'allow_add'    => true,
                'allow_delete' => true,
                'prototype'    => true,
                'required'     => false,
                'by_reference' => false,
                'delete_empty' => true,
                'attr'         => [
                    'class' => 'collection',
                ],
            ])

        ;
                $builder->add('save', SubmitType::class, [
                'label' => 'Valider',
        ]);
    }

    public function configureOptions(OptionsResolver $resolver)
    {
        $resolver->setDefaults([
            'data_class' => worker::class,
        ]);
    }
}

这是我的任务表单：

class TasksType extends AbstractType
{
    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder

        ->add('label')
        ->add('start')
        ->add('end')
;
    }

这是我的 _form.html.twig：


{% block extra_js %}
    <script src="{{ asset('jquery.collection.js') }}"></script>
{% endblock %}

{% block body %}
    <div class="row">
        {%
            form_theme form
                'jquery.collection.html.twig'
                'TaksTemplate.html.twig'
        %}
{{ form_start(form) }}
    <div class="my-custom-class-for-errors">
        {{ form_errors(form) }}
    </div>

        <div class="col">
            {{ form_row(form.Firstname, {'label': 'firstname'}) }}
        </div>
        <div class="col" >
            {{ form_row(form.Lastname, {'label': 'Lastname'}) }}
        </div>

        <div class="col">
            {{ form_row(form.tasks, {'label': 'tasks'}) }}
        </div>

    </div>
{{ form_end(form) }}    </div>
{% endblock %}

{% block script %}

    <script type="text/javascript">
        $('.collection').collection({
            'drag_drop_options': {
                'placeholder': null
            }
        });
    </script>

{% endblock %}

【问题讨论】：

这是 HTML/CSS 问题。

标签： php html css symfony symfony4

【解决方案1】：

另外：是否可以为 collectionType 中的每个元素选择标签？

没有。 symfony collectionType 中不能有多个标签。

我想水平对齐所有 3 个。

用HTMLCSS标签再次询问这个问题

【讨论】：

我添加了 CSS/HTML 标签