通過CSS在輸入框之間添加間距

我目前在嘗試添加一些輸入框之間的間距時遇到了一些麻煩。我曾嘗試將padding添加到它，但它所做的只是移動框，而不是在它們之間放置空格。通過CSS在輸入框之間添加間距

我的代碼如下：由 '沒關係' 提出

.test { 
 
    padding:20px 20px 20px 20px; 
 
} 
 
.ModifiedValues { 
 
    position: absolute; 
 
    left: 250px; 
 
    top: 20px; 
 
    color: #666; 
 
    font-size: 12px; 
 
} \t

<div class="ModifiedValues"> 
 
    <center><b>New Value</b></center> 
 
    <span class="test"><input type="text" name="firstname" value="" style="text-align:left;"><br></span> 
 
    <span class="test"><input type="text" name="firstname" value="" style="text-align:left;"><br></span> 
 
    <span class="test"><input type="text" name="firstname" value="" style="text-align:left;"><br></span> 
 
    <span class="test"><input type="text" name="firstname" value="" style="text-align:left;"><br></span> 
 
</div>

來源

2016-11-25 alex johnson

添加顯示：block to span .test。默認情況下，它是內嵌元素... – sinisake

非常感謝，這已成功 –

下次您提出問題時，請更具體地瞭解所需的結果。完全不清楚你是否想要***垂直空間。順便說一句。 'center'已經被棄用了大約33年。 – connexo

答案已經工作:)

display:block;

來源

2016-11-25 14:47:00

這是正確的，但它仍然沒有解決你的標記（HTML）問題。 –

您需要添加display: block。看一看：

.test { 
 
    padding:5px 20px; 
 
    display: block; 
 
} 
 
.ModifiedValues { 
 
    position: absolute; 
 
    left: 250px; 
 
    top: 20px; 
 
    color: #666; 
 
    font-size: 12px; 
 
} \t 
 

 
.ModifiedValues { 
 
     position: absolute; 
 
     left: 250px; 
 
     top: 20px; 
 
     color: #666; 
 
     font-size: 12px; 
 
    }

<div class="ModifiedValues"> 
 
    <center><b>New Value</b></center> 
 
    <span class="test"><input type="text" name="firstname" value=""/></span> 
 
    <span class="test"><input type="text" name="firstname" value=""/></span> 
 
    <span class="test"><input type="text" name="firstname" value=""/></span> 
 
    <span class="test"><input type="text" name="firstname" value=""/></span> 
 
</div>

來源

2016-11-25 14:51:04

爲什麼你仍然在這個解決方案中使用'
'而不是簡單地向'span'元素添加'margin-bottom'？ – connexo

甚至不需要。剛剛刪除了不需要的'
'標籤，也修復了'input'標籤 –

-1

您可以測試這個代碼。它的工作原理

.ModifiedValues { 
    position: absolute; 
    left: 250px; 
    top: 20px; 
    color: #666; 
    font-size: 12px; 
} 

.test { 
margin: 10px !important; 
text-align: left; 

} 

<div class="ModifiedValues"> 
    <center><b>New Value</b></center> 
    <div class="test"> 
     <span><input type="text" name="firstname" value="" ></span> 
    </div> 
    <div class="test"> 
     <span><input type="text" name="firstname" value="" ></span> 
    </div> 
    <div class="test"> 
     <span><input type="text" name="firstname" value="" ></span> 
    </div> 
    <div class="test"> 
     <span><input type="text" name="firstname" value="" ></span> 
    </div> 
    <div class="test"> 
     <span><input type="text" name="firstname" value="" ></span> 
    </div> 
</div>

來源

2016-11-25 15:05:43 TPLMedia24

對於'id' ***，任何給定值都必須在每個文檔***中唯一。另外，你爲什麼在這裏保留'span'元素？ – connexo

通過CSS在輸入框之間添加間距

回答

相關問題