Question

下面是我正在使用的代码，但是当使用iPAD的媒体查询时，右边框非常靠近第二个Div，我希望所有使用媒体查询的所有设备的边框都能正确对齐？

HTML：

<div class="row">
<div class="medium-6 large-6 columns right-border">
<h4>ABC TEST</h4>

<p>I love coding</p>
<p><strong>Code</strong></p>

</div>
<div class="medium-6 large-6 columns">
<h4>ABC TEST</h4>

<p>Love coding</p>
  <p>live life</p>
</div>
</div>

CSS：

div.right-border:before {
  content: "";
  border-right:1px solid #bcb4b4;
  width:60%;
  position:absolute;
  top: 7%;
  left: 90px;
  height: 80%;
}

@media only screen and (min-width: 320px) and (max-width: 760px) { 
div.right-border:before { 
border-right:none;
border-bottom:1px solid #ca6e6e; 
left:1%;
width:260px;
bottom:90%;
height:90%;
}
 }

Answer 1

您应该在上面的代码中使用的媒体查询中使用相同的选择器：div.right-border:before（不是after）

媒体查询边框长度

1 个答案: