Select 2 + Responsive + CSS... .DTE width=100% OR width=100vw?

blabablaba

Hi guys,

I wondered if width=100vw is a better option than width=100% for .DTE in the standard datatables css download.

I implemented Select2 on a responsive design. If the content of Select2 is wider than the view area of the form (say for mobile), then the Select2 field expands beyond the view area to accommodate the size of the text... this could also take form controls out of view.

I determined the form container

<div class="DTE DTE_Action_Create">EDITOR FORM</div>

Examining the css:

.DTE {
  width=100%;
}

I changed the .DTE css class in my local css to

.DTE {
  width=100vw;
}

This caused the select2 to limit to the screen size including padding and seems to work better than width=100%.

I hope that is helpful to you and anyone else.

allan

Thanks for posting this. Possibly yes - I'm not sure how many people will want the drop down to take the entire width of the browser window, so I'm not going to drop this into Editor just now, but if anyone else has feedback on this, please do add a comment.

Allan