HTML
<div class="select2-container select2-container-multi" id="s2id_5268118036b78">
<ul class="select2-choices">
<li class="select2-search-choice">
<div>aaaaa aaaaaaa</div>
<a href="#" onclick="return false;" class="select2-search-choice-close" tabindex="-1"></a></li>
<li class="select2-search-choice">
<div>bbbb bbbbbbbbb</div>
<a href="#" onclick="return false;" class="select2-search-choice-close" tabindex="-1"></a></li>
<li class="select2-search-choice">
<div>ccc ccc ccccccccc</div>
<a href="#" onclick="return false;" class="select2-search-choice-close" tabindex="-1"></a></li>
<li class="select2-search-field"><input type="text" autocomplete="off" autocorrect="off" autocapitilize="off" spellcheck="false" class="select2-input" id="s2id_autogen4" style="width: 10px;">
</li>
</ul>
<div class="select2-drop select2-drop-multi select2-display-none select2-drop-active">
<ul class="select2-results">
<li class="select2-no-results">No matches found</li>
</ul>
</div>
</div>
Соответствующий CSS
.select2-container-multi {
margin: 10px;
width: 250px;
.select2-choices {
overflow: visible;
}
}
Как вы можете видеть, маленькие серые прямоугольники ("bbb" и "ccc") плавают за пределами их контейнера, когда overflow: visible
установлено. Если я изменю это на overflow: hidden
, то их контейнер будет расширяться, чтобы соответствовать им.
Я хочу, чтобы контейнер расширялся, чтобы соответствовать им, но я также применяю к ним JavaScript, чтобы сделать их перетаскиваемыми, поэтому их можно вытащить за пределы поля. Если overflow: hidden
установлено, то их обрезают в поле, и вы не сможете их увидеть, как только вы их вытащите. Вот почему я пытался overflow: visible
.
Таким образом, мне нужно поведение обоих. Есть ли какой-нибудь CSS, который я могу применить, чтобы сделать окно расширяемым, чтобы оно соответствовало его дочерним элементам, но также имеет overflow: visible
?
Обратите внимание, что overflow: auto
просто создает полосы прокрутки, что тоже не хорошо.
вы пытались дать ему поплавок?
.select2-container-multi .select2-choices {
overflow: visible;
float: left;
}
li
s всплывают ... не из - за какой - то странной видимости. Не понял, что это проблема с исправлением ошибок. Спасибо!