क्या वास्तव में एक div को अपनी सामग्री के आकार के लायक बनाना असंभव है?

Question

मैं यह स्पष्ट करना चाहूंगा कि क्या यह संभव है या नहीं कि एक तत्व के आकार के आधार पर एक div को उसके आकार के अनुरूप बनाया जा सके, बिना तत्वों को फ्लोट किए या उनकी स्थिति को निरपेक्ष बनाने के लिए। क्या यह संभव है?

Comments

सोचिए अगर हम ऐसा कर पाते तो कितना सरल वेब देव होता! मुझे चाहिए display: block-inline!! (यह एक ब्लॉक के रूप में बाहरी रूप से व्यवहार करना है लेकिन एक इनलाइन के रूप में - विपरीत inline-block)

— ADTC

Answer 1

सीएसएस displayसेटिंग

यह निश्चित रूप से संभव है - JSFiddle अवधारणा का प्रमाण जहां आप तीन संभव समाधान देख सकते हैं:

• display: inline-block- यह वह है जिसके बारे में आप अवगत नहीं हैं

• position: absolute

• float: left/right

Comments

धन्यवाद! मैंने इनलाइन-ब्लॉक पर विचार नहीं किया था!

— गेब्रियल सेरुल्ली

Answer 2

आप उपयोग कर सकते हैं display: inline-block।

Comments

मैंने अपनी अवधारणा JSFiddle के प्रमाण को अद्यतन किया है जो संभावना को भी दर्शाता है position:absolute। यह यथासंभव संभव है। मेरे उत्तर के लिंक पर क्लिक करें।

— रॉबर्ट कोरिटनिक

Answer 3

आप उपयोग कर सकते हैं:

width: -webkit-fit-content;
height: -webkit-fit-content;
width: -moz-fit-content;
height: -moz-fit-content;

संपादित करें: नहीं, यह देखने http://red-team-design.com/horizontal-centering-using-css-fit-content-value/

ALSO: http://dev.w3.org/csswg/css-box-3/

Comments

क्या यह एक ट्रोल जवाब है? फिट-कंटेंट चौड़ाई या ऊंचाई के लिए एक वैध संपत्ति मूल्य नहीं है।

— एडम

यह काम करता है लेकिन आपको अपने द्वारा उपयोग किए जाने वाले ब्राउज़र पर -webkit-fit-contentया -moz-fit-contentउसके आधार पर मूल्य निर्धारित करना चाहिए ।

— warownia1

ठीक। मुझे नहीं पता था।

— the_HTML_Man

Answer 4

आप भी उपयोग कर सकते हैं

शब्द-विराम: विराम-सब;

जब कुछ भी नहीं लगता है कि यह हमेशा काम करता है;

Answer 5

यह एज और क्रोम पर अच्छा काम करता है:

  width: fit-content;
  height: fit-content;