Question

我有3个div出现相同的问题：

几个像素低于元素末尾，但高于边框。我该如何解决？

我已经尝试了零填充-没有结果。

这是一些代码。实际上，样式几乎相同，只是内容不同。

<!DOCTYPE html>
<html>
<head>
<style>

#photo {
  position: absolute;
  z-index: 3;
  top: 20%;
  left: 20%;
  border: 5px;
  border-color: #ff6998;
  border-style: solid;
}
#video {
  position: absolute;
  z-index: 5;
  top: 40%;
  left: 40%;
  border: 5px;
  border-color: #ff6998;
  border-style: solid;
}
#text {
  position: absolute;
  z-index: 9;
  top: 10%;
  left: 20%;
  border: 5px;
  border-color: #ff6998;
  border-style: solid;
}

</style>
</head>
<body>

<div id="photo">
  <div id="photoheader">Фото</div>
  <a onClick="pickimg();">
  <img src="" id="randimg">
  </a>
</div>

<div id="video">
  <div id="videoheader">Видео</div>
  <iframe id="randvideo" width="640" height="360" frameBorder="0" src="" allowfullscreen></iframe>
</div>

<div id="text">
  <div id="textheader">Текст</div>
  <textarea class="scrollabletextbox" id="randnote" onClick="picknote();"></textarea>
</div>

</body>
</html>

div的边框比div的边框长

0 个答案: