且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

Bootstrap 自动调整列宽

更新时间:2022-12-27 17:01:46

答案是否定的!如果您查看源代码你会看到 col-sm 的宽度是用百分比来定义的:

//生成小列.make-sm-column(@columns; @gutter: @grid-gutter-width) {位置:相对;最小高度:1px;padding-left: (@gutter/2);填充右:(@gutter/2);@media(最小宽度:@screen-sm-min){向左飘浮;宽度:百分比((@columns/@grid-columns));}}

所以***的办法是在服务器端分配正确的类编写一个小脚本来检查内容并调整类.

I have created Two column page.Like,

<div class="row">
  <div class="col-sm-2"></div>
  <div class="col-sm-10"></div>
</div>

Does bootstrap have option like adjusting the width of the column if first column doesn't have data.?

The quick answer is no! If you take a look at the source code you'll see that for col-sm the width is defined in terms of percent:

// Generate the small columns
.make-sm-column(@columns; @gutter: @grid-gutter-width) {
  position: relative;
  min-height: 1px;
  padding-left:  (@gutter / 2);
  padding-right: (@gutter / 2);

  @media (min-width: @screen-sm-min) {
    float: left;
    width: percentage((@columns / @grid-columns));
  }
}

so your best shot would be to assign correct classes on the server side OR write a small script that checks the content and adapts the classes.