Question

如你所见，我有2个元素。他们两个都有100％的高度，但一个有效，另一个没有。的为什么吗

此外，是否有人知道如何将背景图片放在imageZone中说预览此处或图标？

＆＃13;

.dropzone {
  border: 2px dashed #ccc;
  width: 100%;
  height: 100%;
  text-align: center;
  padding: 120px 60px 60px 60px;
}

.dropzone span {
  font-size: 25px;
}

.dropzone.dragover {
  border-color: #000;
  color: #000;
  background-color: #eeeeee5c;
}

.dropzoneUser {
  padding: 60px !important;
}

.imageZone {
  border: 2px dashed #ccc;
  width: 100%;
  max-height: 100%;
}

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<div class="row">
  <label class="col-sm-2 control-label">Upload avatar <span data-toggle="tooltip" data-placement="right" title="Upload an avatar image for this user." class="fa fa-question-circle help-label"></span></label>
  <div class="col-sm-10">
    <div class="col-sm-8">
      <div class="dropzone dropzoneUser" id="dropzone">
        <span class="uploadIcon fa fa-upload"></span><br><br>
        <input type="file" name="fileUpload" accept="image/*" id="fileUpload" class="hide">
        <label for="fileUpload" id="uploadLabel" class="uploadLabel">Choose a file</label>
        <span>or drag & drop here</span>
      </div>
    </div>
    <div class="col-sm-4">
      <img id="previewImage" class="imageZone">
    </div>
  </div>
</div>

＆＃13;

为什么高度100％有时不起作用？

0 个答案: