2017-06-29 70 views
0

下面是我正在使用的代碼,但是當使用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%; 
} 
} 

回答

1

你應該用在你的代碼中使用它上面的媒體查詢相同的選擇:div.right-border:before(未after

+0

謝謝你,我改變它之前。我正在使用媒體查詢,但是當我測試ipad版本時,右邊框非常接近第二個div。我需要與媒體查詢和瀏覽器進行邊界對位。 – code21

+0

對不起,但我不明白你在說什麼。你的問題是關於底部邊界,你的評論是關於一個右邊界,並且你剛纔評論中剛剛鏈接的代碼不包含任何*邊界。你應該在問題中發佈完整的代碼,清楚地表明問題。 – Johannes

+0

我已經在我的問題中更新了我的代碼 – code21