Md卡填充

Question

您好，我正在使用 angular material。我用以下代码创建了一张 md-card:

<div  layout="row">
<md-card class="col-md-4">
  <div class="md-card-image" style="background-color: #40DEC8; text-align: center">
    <h1 style="color: white;">Title</h1>
  </div>
  <md-input-container>
    <label>Name</label>
    <input ng-model="detailsCtrl.parking.name">
  </md-input-container>
  <md-input-container>
    <label>District</label>
    <input ng-model="detailsCtrl.parking.district">
  </md-input-container>
  <md-input-container>
    <label>Description</label>
    <textarea ng-model="detailsCtrl.parking.description" columns="1" md-maxlength="500"></textarea>
  </md-input-container>
</md-card>

结果是这样的：

有什么方法可以去除黑色箭头所示的白色 space（填充）并用绿色填充它？

Answer 1

添加填充的不是卡片，而是（我假设bootstrap）classcol-md-4。一个解决方案是将 col-md-4 移到 md-card 之外，如下所示：

<!-- The padding will be on this div instead of the card -->
<div class="col-md-4"> 
    <md-card>
        <div class="md-card-image" style="background-color: #40DEC8; text-align: center">
            <h1 style="color: white;">Title</h1>
        </div>
        <!-- Other html -->
    </md-card>
</div>

Md卡填充

Md-card padding

html

css

angularjs

angular-material