फॉर्म तत्व के नीचे रहस्य सफेद स्थान

Question

जब किसी div के अंदर एक फॉर्म डाला जाता है, तो किसी कारण से फ़ॉर्म के नीचे हमेशा अतिरिक्त स्थान होता है। हम उस जगह से कैसे छुटकारा पा सकते हैं?

स्टैक ओवरफ़्लो से कोड स्निपेट में, यह वास्तव में अंतरिक्ष नहीं दिखाता है, लेकिन कहीं और, यह करता है। नीचे दिया गया कोड सब कुछ है।

div { 
 
    border: 1px solid blue; 
 
} 
 
form { 
 
    border: 1px solid red; 
 
}

<div> 
 
    <form> 
 
    Form 
 
    </form> 
 
</div>

Answer 1

आप एक margin-bottom: 16px है। इसे हटा दें और यह आपकी समस्या का समाधान करेगा।

Answer 2

आप वेब डेवलपर उपकरण (F12) का उल्लेख कर सकते हैं, और आप देखेंगे कि एक form तत्व, के रूप में browser's default stylesheet में परिभाषित एक margin-bottom: 1em साथ आता है:

आप को परिभाषित करते हुए ओवरराइड कर सकते हैं कि आपका अपना मार्जिन नियम:

form { margin-bottom: 0; }