Question

我有一个与此Flexbox - two fixed width columns, one flexible

类似的问题

但是那个是关于使用Flexbox来做的。我试图使用AngularJS Material。我希望我的左右div是固定的28px宽度，中心div是flex。

这样的事情：

＆＃13;

<div layout="row" layout-margin>
  <!-- Alphabet - First Half -->
  <div flex="28px">
    <md-list>
      <md-list-item>
        <md-button class="md-fab md-mini">
          <div align="center">A</div>
        </md-button>
      </md-list-item>
    </md-list>
  </div>

  <div flex>
    <md-content></md-content>
  </div>

  <!-- Alphabet - Second Half -->
  <div flex="28px">
    <md-list>
      <md-list-item>
        <md-button class="md-fab md-mini">
          <div align="center">N</div>
        </md-button>
      </md-list-item>
    </md-list>
  </div>
</div>

＆＃13;

Answer 1

flex属性值限制为33,66和5的倍数。例如：flex =“5”，flex =“20”，“flex =”33“，flex =”50“，flex =”66“，flex =”75“，....

试试这个

<div layout="row" layout-margin>

  <div flex="25">
   <md-list>
     <md-list-item>
       <md-button class="md-fab md-mini">
         <div align="center">A</div>
       </md-button>
     </md-list-item>
   </md-list>
  </div>

 <div flex>
   <md-content></md-content>
 </div>


 <div flex="25">
   <md-list>
     <md-list-item>
       <md-button class="md-fab md-mini">
          <div align="center">N</div>
      </md-button>
     </md-list-item>
   </md-list>
 </div>
</div>

AngularJS材质中3列布局中的两个固定尺寸列

1 个答案: