यदि आवश्यक न हो तो CSS Hide स्क्रॉल बार

Question

मैं यह पता लगाने की कोशिश कर रहा हूं कि overflow-y:scroll;अगर जरूरत नहीं है तो मैं कैसे छिपा सकता हूं । मेरे कहने का मतलब यह है कि मैं एक वेबसाइट बना रहा हूं और मेरे पास एक मुख्य क्षेत्र है जिसमें पोस्ट प्रदर्शित की जाएंगी और मैं स्क्रॉल बार को छिपाना चाहता हूं यदि सामग्री वर्तमान चौड़ाई से अधिक नहीं है।

साथ ही, मेरा दूसरा सवाल। मैं इसे बनाना चाहता हूं, जब पोस्ट वर्तमान चौड़ाई से अधिक हो जाती हैं, तो चौड़ाई अपने आप बढ़ जाएगी और सामग्री बॉक्स से बाहर नहीं जाएगी।

किसी को भी यह कैसे करना है एक सुराग है?

डाक क्षेत्र:

.content {
    height: 600px;
    border-left: 1px solid;
    border-right: 1px solid;
    border-bottom: 1px solid;
    font-size: 15px;
    text-align: justify;
    line-height: 19px;
    overflow-y:scroll;
}

मुख्य वेबसाइट कंटेनर:

.container {
    margin: 0 auto;
    width: 757px;
    margin-top: 30px;
    text-align: center;
}

Comments

क्या आप ऊर्ध्वाधर या क्षैतिज स्क्रॉल बार को छिपाना चाहते हैं? क्या आप उदाहरण के लिए html कोड, jsfiddle.net के साथ पोस्ट कर सकते हैं और इसे यहां लिंक कर सकते हैं

— RJo

हैलो, मैंने उन 2 वर्गों को पोस्ट किया है जिनका मैं उपयोग कर रहा हूं। Html में, कॉलिंग क्लासेस के अलावा कुछ नहीं।

— थानोस परवंटिस

Answer 1

यदि यह विरासत में नहीं मिला है तो संपत्ति को पूरी तरह overflow-yसे सेट करें autoया हटा दें।

Comments

मैं कर सकता था, लेकिन मुझे अपने दूसरे प्रश्न के साथ कुछ मदद की ज़रूरत थी, चौड़ाई के बारे में, ऑटो में वृद्धि।

— थानोस परवन्तिस

आप हमेशा

— स्टैकओवरफ़्लो

आपके उदाहरणों में स्क्रॉल कहां है?

— ग्रीन

overflow-y: autoहल की गई मेरी समस्या को सेट करते समय - लिंक वास्तव में इसका एक उदाहरण नहीं दिखाता है ...

— छाया

ध्यान दें कि overflow-x: autoक्षैतिज स्क्रॉलबार को छिपाने के लिए भी काम करता है।

— एडवर्ड डिसूजा

Answer 2

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

आप x और y अक्ष को व्यक्तिगत रूप से overflow-xऔर overflow-yगुणों के साथ भी नियंत्रित कर सकते हैं।

उदाहरण:

.content {overflow:auto;}
.content {overflow-y:auto;}
.content {overflow-x:auto;}

Comments

यद्यपि हम आपके उत्तर के लिए धन्यवाद करते हैं, लेकिन बेहतर होगा यदि वह अन्य उत्तरों के शीर्ष पर अतिरिक्त मूल्य प्रदान करे। इस मामले में, आपका उत्तर अतिरिक्त मूल्य प्रदान नहीं करता है, क्योंकि कोई अन्य उपयोगकर्ता पहले से ही उस समाधान को पोस्ट करता है। यदि पिछला उत्तर आपके लिए उपयोगी था, तो आपको उसी जानकारी को दोहराने के बजाय उसे वोट देना चाहिए।

— टोबे स्पीट ऑक्ट

Answer 3

आप ओवरफ़्लो करने के लिए .content और .container दोनों का उपयोग कर सकते हैं: ऑटो। इसका मतलब है कि यदि यह पाठ से अधिक है तो स्वचालित रूप से स्क्रॉल x- अक्ष और y- अक्ष आएगा। (आमतौर पर एक्स-एक्स-एक्स और वाई-एक्सिस देने के लिए अतिप्रवाह देने की आवश्यकता नहीं है: ऑटो)

.content {अतिप्रवाह: ऑटो ;;

Answer 4

.selected-elementClass{
    overflow-y:auto;
}

Answer 5

.कंटेनर {ओवरफ्लो: ऑटो;} ट्रिक करेगा। यदि आप विशिष्ट दिशा को नियंत्रित करना चाहते हैं, तो आपको उस विशिष्ट अक्ष के लिए ऑटो सेट करना चाहिए। एई

.container {overflow-y: auto;} .container {overflow-x: hidden;};

उपरोक्त कोड x- अक्ष में किसी भी अतिप्रवाह को छिपाएगा और y- अक्ष पर जरूरत पड़ने पर एक स्क्रॉल-बार उत्पन्न करेगा। लेकिन क्या आपको यह सुनिश्चित करना है कि आप डिफ़ॉल्ट ऊंचाई को कंटेनर की ऊंचाई से छोटा कर दें; यदि नहीं, तो स्क्रॉल-बार छिपाया नहीं जाएगा।