सीएसएस प्रदर्शन: टेबल न्यूनतम ऊंचाई काम नहीं कर रहा है


104

क्या कोई जानता है कि मैं नवीनतम ब्राउज़रों के साथ न्यूनतम ऊंचाई काम कर सकता हूं? मैं सीएसएस तालिकाओं का उपयोग कर रहा हूं और यह न्यूनतम ऊंचाई को नजरअंदाज करता है।

<div style="background-color: red; display: table; min-height: 100px;">
abc
</div>

बेला


1
इसी तरह की पोस्ट: stackoverflow.com/questions/25238/100-min-height-css-layout
diEcho

1
आप सीएसएस तालिकाओं को परिभाषित कर सकते हैं ? कुछ मार्कअप मिल गया?
एलेक्स

1
अपने html को पोस्ट करें, css के अनुसार और, यदि संभव हो तो, अपनी समस्या को दिखाने के लिए अपनी साइट का लिंक दें (या jsfiddle.net के निर्माण की कोशिश करें )।
ओजी

यह अभी भी फ़ायरफ़ॉक्स के साथ एक परेशानी है, हालांकि बग को चौदह साल बाद बताया गया है। Bugzilla.mozilla.org/show_bug.cgi?id=307866
Frédéric

जवाबों:


204

तालिकाओं का उपयोग करते समय, ऊंचाई अनिवार्य रूप से न्यूनतम ऊंचाई होती है, क्योंकि तालिकाओं में हमेशा खिंचाव होता है। बस "मिनट" से छुटकारा पाएं और यह आपकी अपेक्षा के अनुरूप काम करेगा।


13
यह पूरी तरह से अनपेक्षित है, लेकिन स्पॉट-ऑन है। सबसे अच्छे परिणाम अंतरतम display: table-cellतत्वों पर "निश्चित" ऊंचाई डालने के साथ आते हैं।
अनन्तकाल १२

4
मैंने IE में परीक्षण नहीं किया है लेकिन ऐसा लगता है कि फ़ायरफ़ॉक्स अभी भी इससे प्रभावित है।
डेक्स

2
पुष्टि heightकरता है कि min-heightमैक पर क्रोम 37, सफारी 7 और एफएफ 32 में काम करता है और नहीं करता है। Win 8.1 पर IE11 दोनों में सही व्यवहार देता है। jsfiddle.net/nuwcyvwn/1
स्टीफन मुलर

1
सच नहीं। अगर मुझे एक तालिका चाहिए, जो कि कम से कम 8 इंच लंबी हो (मैं प्रिंट नियंत्रण के लिए सीएसएस का उपयोग करता हूं) और इसे भरने के लिए पर्याप्त पंक्तियों का अभाव है, लेकिन मेरे पास एक tfoot परिभाषित है, मैं एक स्पेसर पंक्ति प्रदान कर सकता हूं (परिभाषित करने के लिए लंबवत खिंचाव) मेरी अन्य पंक्तियों पर ऊँचाई सुनिश्चित करने के लिए कि वे नहीं करते हैं और मुझे जो मिलता है वह एक बड़ा अंतर है जो मेरे पाद को रखता है जहां यह होना चाहिए। Chrome में शानदार काम करता है, लेकिन FF या PDf कनवर्टर का उपयोग नहीं कर रहा हूं; wkhtmltopdf। हां, ऊंचाई काम करती है, लेकिन मीन-ऊंचाई के समान शब्द का अर्थ नहीं है।
रेनबा

7

height: 1px;मेज या किसी भी मूल्य पर उपयोग करें । मूल रूप से इसके साथ काम करने के लिए आपको टेबल को कुछ ऊंचाई देने की आवश्यकता है min-height। केवल min-heightफ़ायरफ़ॉक्स पर तालिकाओं पर काम नहीं करेगा।


4
ओपी पूछ रहा है कि इसे नवीनतम ब्राउज़र के साथ कैसे काम करना है। मैंने बस उसे एक उपाय दिया। यह कैसे सही नहीं है?
virajs0ni

कुछ ऊंचाई दे जैसे ऊंचाई: 1px जैसा कि आपने कहा, फिर इसने काम करना शुरू कर दिया
मोहम्मद हुसैन

1

जब भी आप का उपयोग कर रहे हैं display:table;या किसी भी गहरी संपत्ति की तरह display:table-cell;का उपयोग heightकरने पर विचार करें min-height। जैसा कि तालिकाओं में ऊंचाई = न्यूनतम ऊंचाई में ऑटो-स्पैन सुविधा को देखते हुए।


1

फ़ायरफ़ॉक्स के लिए समाधान

मिनट की ऊंचाई सेट करने के लिए ऊंचाई जोड़ें

div {
    display: table;
    width: 100%;
    height: 0;
    min-height: 100px;
}

ऊँचाई की संख्या अपेक्षा के अनुरूप काम करने के लिए न्यूनतम ऊंचाई के बराबर या उससे कम वास्तविक मूल्य हो सकती है।

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.