आईई 8

Question

में प्रदर्शित करने के लिए फोर्स वर्टिकल स्क्रॉलबार यदि पृष्ठ काफी लंबा नहीं है तो वर्टिकल बार आईई 8 में दिखाई नहीं देता है। एफएफ में, वहाँ इस

html { 
    overflow: -moz-scrollbars-vertical; 
} 

मैं IE8 के लिए निम्नलिखित की कोशिश की के लिए एक समाधान नहीं है: overflow:scroll; लेकिन स्क्रॉल पट्टी दोनों पक्षों पर दिखाई देता है। मैं इसे केवल लंबवत और क्षैतिज नहीं चाहता हूं। स्क्रॉल-वाई काम नहीं करता है।

कोई समाधान?

Answer 1

ओह यह लगा। इसके

body { 
    overflow-y: scroll; 
} 

Answer 2

एक अन्य समाधान 100% करने के लिए शरीर की ऊंचाई निर्धारित करने के लिए है - एक से पहले/http://www.iecustomizer.com/msmvp/HTMLHeightTest.htm

Answer 3

पर उदाहरण के बाद मैं का उपयोग निम्न:

html { 
    height: 101%; /* setting height to 101% forces scroll bar to display */ 
} 

Answer 4

प्रयास करें

-ms-overflow-y : scroll;

Answer 5

इसे अपने div में रखें

style="overflow: -moz-scrollbars-vertical; overflow-y: scroll; 

उदाहरण के लिए

:

<div class="left" style="overflow: -moz-scrollbars-vertical; overflow-y: scroll; 
width: 230px; height: 500px;" > 

Answer 6

html {height: 100%; margin-bottom: 1px;} 

अपने पृष्ठ हमेशा 1px अब तो स्क्रॉल बार हमेशा दिखाई देता है और केवल उन्हीं पृष्ठों को काफी देर तक तो यह नहीं है नहीं कर रहे हैं करने के लिए 1px स्क्रॉल कहते हैं दर्शक सोचते हैं कि वे कुछ खो रहे हैं और किसी भी कारण से नीचे स्क्रॉल करें। सभी मुख्य स्ट्रीम ब्राउज़रों में सरल और काम करता है (मैंने परीक्षण किया)

Answer 7

एचटीएमएल, बॉडी { ऊंचाई: 100.1%; }

Answer 8

html { 
    height: 100%; 
    border-bottom: 1px #999 solid; 
} 

नोट: मैं उन पृष्ठों को मुझे पता स्क्रॉल करने के लिए की जरूरत नहीं होगी पर स्क्रॉलबार मजबूर करने के लिए करना चाहता था। यह समाधान ऐसी स्थिति के लिए है।

जोन्सी का समाधान सभी ब्राउज़रों में मेरे लिए काम नहीं करता है, लेकिन मैं एक कमजोर 1px ग्रे पट्टी तैयार करने के लिए तैयार हूं जो सभी ब्राउज़रों में लगातार काम करता है। मेरे लिए यह एक पूर्ण 1% अतिरिक्त (चिप का समाधान) दिखाने से बेहतर है। डिजाइन के अनुसार, यह शायद ही कभी रियायत है क्योंकि यह बहुत महत्वहीन है - इसे आजमाएं और देखें कि मेरा क्या मतलब है।

इसके अलावा, यह समाधान सुपर भविष्य-सबूत होने जा रहा है। यदि आप अन्य समाधानों की तरह रिक्त स्थान जोड़ना चाहते हैं, तो भविष्य में ब्राउज़र में ऑप्टिमाइज़ेशन का निर्माण करने के बारे में कोई जानकारी नहीं है और मैं कल्पना कर सकता हूं कि कुछ ब्राउजर डिस्प्ले खाली जगह खाली कर रहे हैं और इसे खत्म कर रहे हैं (अजनबी चीजें हुई हैं)। 1 पीएक्स को स्वीकार करके, आप ब्राउज़र को इस 1 पिक्सेल से निपटने के लिए मजबूर कर रहे हैं इससे कोई फर्क नहीं पड़ता।

Answer 9

सफारी में खड़ी स्क्रॉलबार के लिए मजबूर कर के लिए तिथि (2012 मई) को बेस्ट जबाब, ओपेरा & फ़ायरफ़ॉक्स है:

html { 
    height: 101%; /* setting height to 101% forces scroll bar to display */ 
} 
html { min-height: 100%; padding-bottom: 1px; } 

ओपेरा सबसे कठिन था और केवल खड़ी स्क्रॉलबार कोई फर्क नहीं पड़ता पेज की ऊंचाई सम्मिलित हैं यदि उपरोक्त दोनों HTML टैग का उपयोग किया गया था।

धन्यवाद - डायने

Answer 10

बस ऐसे ही Normalize.css की सिफारिश की और कहा:

html { overflow-y: scroll; } 

जो एलेक के जवाब से थोड़ा भिन्न है, लेकिन चूंकि यह गिरा दिया है। HTML5 Boilerplate प्रति:

निम्नलिखित शैली अब कोई समस्या नहीं कि फ़ायरफ़ॉक्स में पैदा कर सकते हैं जब जे एस वाले प्लग इन व्यूपोर्ट आयाम गणना पर भरोसा करते हैं (क्रियार्थ द्योतक या खींचें और ड्रॉप UI के की तरह) के साथ संयुक्त की वजह से डिफ़ॉल्ट रूप से शामिल किया गया है ।

और वास्तव में मेरा अनुभव यह है कि यह कुछ jQuery प्लगइन्स को गड़बड़ कर देता है।

मुझे यकीन नहीं है कि विभिन्न न्यूनतम ऊंचाई/मार्जिन-तल/पैडिंग-नीचे समाधान क्यों पसंद नहीं किए जाते हैं, लेकिन वे एक सक्रिय स्क्रॉलबार बनाते हैं (हालांकि 1px आंदोलन के साथ) जबकि ओवरफ्लो-वाई अक्षम करता है स्क्रॉलबार, जो अच्छा है।

Answer 11

अतिप्रवाह जोड़ें: एचटीएमएल टैग के लिए सीएसएस में ऑटो।

Answer 12

खैर मेरी कोड देखते हैं, datatable 1 DIV

<div style="overflow-y: scroll; overflow-x: scroll; width: 44em; height: 17em;"> 
    <p:dataTable id="dataTableDeposito" lazy="true" style="width: 1040px; height: 240px; " 
       selection="#{envioValijaView.selectedItems}" 
       emptyMessage="#{msg.tablaVaciaDeposito}" 
       value="#{envioValijaView.valijaManagedBean.valijaBean.listaDepositos}" 
       var="tablaDepositos" 
       rowKey="#{tablaDepositos.idDespositoCheque}"> 


     <p:column sortBy="bancoBean.nombreBanco" headerText="#{label.fechaHora}" styleClass="texto_14" width="150"> 
       <h:outputLabel style="font-size: 12px; text-align: center;" value="#{label.cantDepositos}"/> 
     </p:column> 

     <p:column sortBy="nroCataporte" headerText="#{label.nroCataporte}" styleClass="texto_14" disabledSelection="#{true}" width="150"> 
      <p:commandLink action="#{envioValijaView.detalleDeposito}" value="#{tablaDepositos.idDespositoCheque}"> 
       <f:setPropertyActionListener value="#{tablaDepositos}" target="#{envioValijaView.depositoChequeBean}"/> 
      </p:commandLink> 
     </p:column> 

     <p:column sortBy="nroCheque" headerText="#{label.cantiDepositos}" styleClass="texto_14" width="155"> 
      <h:outputLabel value="#{label.montTotalDeposito}" styleClass="texto_12"/> 
     </p:column> 

     <p:column sortBy="monto" headerText="#{label.montoTotal}" styleClass="texto_14" width="150"> 
      <h:outputText value="#{tablaDepositos.montoDeposito}" styleClass="texto_12"> 
       <f:convertNumber pattern="#{envioValijaView.patronMoneda}"/> 
      </h:outputText> 
     </p:column> 

     <!-- Verificar --> 
     <p:column sortBy="monto" headerText="#{label.transportista}" styleClass="texto_14" width="150" > 
      <h:outputText value="#{tablaDepositos.montoDeposito}" styleClass="texto_12"> 
       <f:convertNumber pattern="#{envioValijaView.patronMoneda}"/> 
      </h:outputText> 
     </p:column> 

     <p:column sortBy="monto" headerText="#{label.estado}" styleClass="texto_14" width="150"> 
      <h:outputText value="#{tablaDepositos.montoDeposito}" styleClass="texto_12"> 
       <f:convertNumber pattern="#{envioValijaView.patronMoneda}"/> 
      </h:outputText> 
     </p:column> 
    </p:dataTable> 
</div>