CSS - 从最后一个之前的DIV获取宽度

标签 css width jquery-select2

我在页面上有一个 Select2 元素,右侧有一个按钮,我希望 Select2 占用除按钮占用的所有空间。问题是 Select2 激活后会注入(inject)自己的格式,我不知道如何解决这个问题。

这是我的:

<ul style="width:100%">
 <li>
  <label style="display:inline">From: </label>
  <div class="select2-container select2-container-multi test" style="width:0px">
  <ul class="select2-choices">...

我希望 select2-choices 是第一个 ul 的 90% 但如果我放

.test .select2-choices {
    width:90%;
}

然后它给了我前一个 div 的 90%,即 0px。有没有办法从第一个 ul 而不是从父 div 获取“select2-choices”的宽度?

最佳答案

不适用于 CSS。为此,您需要使用一些 javascript。您是否有特殊原因需要您的 parent 拥有 0px 宽度?

编辑: 你可以在 jQuery 中做这样的事情。我不建议对百分比进行硬编码,但这应该能让你继续。

$(document).ready(function(){
    $(window).on('resize',function(){
       var $choices = $('.select2-choices');
       var parentWidth = $choices.parents('ul').width();
       $choices.width(parentWidth*.9);        
    }).trigger('resize');
});

http://jsfiddle.net/BAGkD/

关于CSS - 从最后一个之前的DIV获取宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18835556/

相关文章:

html - z-index 无法正常运行

javascript - 使用CSS从顶部剪辑图像

html - 如果屏幕不够宽,如何使用 CSS 有条件地调整图像大小?

父元素中的 HTML CSS 表格填充空间

javascript - 如何重置 select2 中的特定选定选项

javascript - 如何更改 Select2 箭头图标?

javascript - 如何切换自定义 HTML 元素的 View /显示?

css - 导入外部 css 时(在 vue.js 组件中),webpack 2 退出并显示代码 3221226505

javascript - 在非移动页面上检测移动设备屏幕宽度和高度

jquery - 即使使用 CTRL 也限制 select2 选择