如何刪除divs之間的垂直空白

我在我的邊界divs之間出現了一些空白區域，我不想要它。這裏的大多數解決方案都會涉及到具有其他方面（如寬度和高度）的div，但我的是純文本。如何刪除divs之間的垂直空白

.h1z1 { 
 
    text-align: center; 
 
} 
 
.g1 h2, .g2 h2, .g3 h2 { 
 
    padding: 10px; 
 
    background-color: #ccffcc; 
 
} 
 
.g1, .g2, .g3 { 
 
    border-left: 6px solid #00ff00; 
 
}

<body style="font-family: 'Source Code Pro', monospace;"> 
 
    <div class="header"></div> 
 
    <div class="gtitle"> 
 
    <h1 class="h1z1">Graphics Cards</h1> 
 
    <hr /> 
 
    </div> 
 
    <div class="g1"> 
 
    <h2>Titan XP</h2> 
 
    </div> 
 
    <div class="g2"> 
 
    <h2>Titan X (Pascal)</h2> 
 
    </div> 
 
    <div class="g3"> 
 
    <h2>GeForce GTX 1080ti</h2> 
 
    </div> 
 
</body>

來源

2017-11-04 ConfusedCodeCat

給margin:0;到.g1 h2, .g2 h2, .g3 h2。因爲h2有默認的邊距。

.h1z1{ 
 
    text-align: center; 
 
} 
 

 
.g1 h2, .g2 h2, .g3 h2{ 
 
    padding: 10px; 
 
    background-color: #ccffcc; 
 
    margin:0; 
 
} 
 

 
.g1, .g2, .g3{ 
 
    border-left: 6px solid #00ff00; 
 
}

<body style="font-family: 'Source Code Pro', monospace;"> 
 
    <div class="header"></div> 
 
    <div class="gtitle"> 
 
    <h1 class="h1z1">Graphics Cards</h1> 
 
    <hr /> 
 
    </div> 
 
    <div class="g1"> 
 
    <h2>Titan XP</h2> 
 
    </div> 
 
    <div class="g2"> 
 
    <h2>Titan X (Pascal)</h2> 
 
    </div> 
 
    <div class="g3"> 
 
    <h2>GeForce GTX 1080ti</h2> 
 
    </div> 
 
</body>

來源

2017-11-04 04:36:49

真棒，謝謝！我看到解決方案比我想象的更簡單。 – ConfusedCodeCat

最受歡迎..... :) –

如果答案對您有幫助，請接受爲正確答案。 –

如何刪除divs之間的垂直空白

回答

相關問題