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

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

blabablabablabablaba Posts: 47Questions: 19Answers: 0
edited January 2020 in Plug-ins

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.

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 61,627Questions: 1Answers: 10,090 Site admin
    Answer ✓

    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

This discussion has been closed.