Skip to content

Overflowing labels in CheckboxList don't break correctly with Bootstrap 4 #137

@NicoNuernberger

Description

@NicoNuernberger

Steps to reproduce the issue

  1. Setup Yii2 with Bootstrap 4
  2. Create a form and within that form create a checkbox list for a model. Ensure that the list of checkboxes is rendered within a container with a limited width and that the list of choices contains at least one string long enough to surpass the width of the container. My example:
    $form->field($formModel, 'answers', [ 'showRequiredIndicator' => false, ])->checkboxList($formModel->possibleAnswerStrings);
  3. Check the rendered view

Expected behavior and actual behavior

On 1.60, the checkbox list behaves as expected with Bootstrap 4:
image
With the following HTML: Pastebin

On 1.6.1 and upwards i get the following however:
image
With the following HTML: Pastebin

Environment

Browsers

  • Google Chrome
  • Mozilla Firefox
  • Internet Explorer
  • Safari

Operating System

  • Windows
  • Mac OS X
  • Linux
  • Mobile

Libraries

  • jQuery version: v3.6.0
  • yii2-widget-activeform version: from 1.6.1 upwards
  • Bootstrap 4.6.2

Isolating the problem

  • This bug happens on the demos page
  • The bug happens consistently across all tested browsers
  • This bug happens when using yii2-widget-activeform without other plugins.

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions