बूटस्ट्रैप 2 सेट संवाद/मोडल स्थिति

Question

मैं एक तरह से यह करने के लिए मिल गया है: तो margin: -335px 0 0 -280px संवाद स्थिति को नियंत्रित करने

उपयोग मार्जिन;

चौड़ाई सेटिंग आप मार्जिन width: 900px; margin: -250px 0 0 -450px;

रीसेट करना होगा ऊंचाई उपयोग अधिकतम-ऊंचाई max-height: 800px;

http://www.revillwebdesign.com/change-the-height-width-and-position-of-a-modal-in-twitter-bootstrap/

के आधार पर वहाँ यह करने के लिए एक बेहतर तरीका है स्थापित करने के लिए? इस या किसी अन्य दृष्टिकोण का उपयोग करना, क्या डायलॉग को केवल top:0px पर स्लाइड करने का कोई तरीका है और बर्खास्त होने तक वहां रहें?

मैंने पहले मार्जिन सेटिंग्स का उपयोग करके यह उल्लेख किया है लेकिन स्पष्ट रूप से जैसे ही ब्राउज़र का आकार बदलता है, इसे देखने से बाहर धकेल दिया जाएगा।

Answer 1

आप सीएसएस स्थिति को ओवरराइड, जैसे

.modal, .modal.fade.in { 
    top: 0; /* was 10% */ 
} 

ध्यान दें, यह Bootstrap 2.2.2 के साथ है। एकमात्र मार्जिन एक नकारात्मक बाएं मार्जिन है जो मोडल की आधा चौड़ाई है (क्षैतिज मोडल को केंद्रित करता है)। कोई शीर्ष मार्जिन की आवश्यकता नहीं है।

jsFiddle यहाँ उदाहरण - http://jsfiddle.net/uuwAn/1/

Answer 2

आप इस व्यवहार को संग्रह करने के लिए अपने अंत में CSS संशोधित कर सकते हैं।

.modal-body { 
    max-height: 350px; 
    -webkit-overflow-scrolling: touch; 
} 

@media screen and (max-height: 450px), (max-height: 450px) { 
    .modal-body { 
     max-height: 130px; 
    } 

} 

अब यह मोबाइल उपकरणों पर अच्छी तरह से काम करेगा। नोट: CSS की मीडिया क्वेरी का उपयोग करके किया गया।