如何设计内部div

时间:2016-08-22 23:42:09

标签: javascript html css angularjs angular-material

我正在使用角度材料标签。问题是标签大小不一样。取决于内容。所以我想知道我是否可以使内部ng-scope与外部ng-scope的大小相同。

这是生成的md-tab-content

的简化版本
<md-tab-content id="tab-content-3" class="_md ng-scope md-active">
  <div class="ng-scope ng-isolate-scope">
  </div>
</md-tab-content>

我可以参考一个角元素吗?并做一些像

md-tab-content > div.ng-scope {
   and set size here = outside size?

   //worst case set the height by hand
   height: 252px;
}

当外div为252

时,内部md-tab-content高度为57

enter image description here

标签代码

<div id="tree-footer-container" ng-cloak>
    <md-tabs id="jc" md-selected="selectedIndex">
        <md-tab   class="fullSize" ng-repeat="tab in tabs" ng-disabled="tab.disabled">
             <md-tab-label>
                    <div style="float: left;padding-right: 10px;">{{tab.title}}</div>
             </md-tab-label>
             <md-tab-body>
                 <div flex style="background:blue" class="demo-tab tab{{$index%4}}" ng-include="tab.url">
                 </div>
             </md-tab-body>
         </md-tab>
    </md-tabs>
</div>

2 个答案:

答案 0 :(得分:0)

尝试使用材质布局指令:

<md-tab-content id="..." layout="column" class="...">
  <div flex class="...">
  </div>
</md-tab-content>

答案 1 :(得分:0)

我不确定您的所有课程,但我认为这可以通过jQuery修复它:

var newWidth = $('.ng-isolate-scope').outerWidth;
$('.classOfOtherDiv').width(newWidth);

首先获得一个div的外部宽度然后将其应用于另一个div。那有用吗?