altezza: problema al 100% in IE7, non in FF

StackOverflow https://stackoverflow.com/questions/2146416

Domanda

Voglio visualizzare una pagina senza barra di scorrimento (altezza: 100%). Ho letto i suggerimenti per aggiungere questo argomento per HTML e corpo . Ma non funziona come mi aspetto. In FF anzi non vedo una barra di scorrimento. Ma in IE7 e 8 (modalità standard) v'è una barra di scorrimento. In quirks mode funziona come previsto. Si prega di dare un'occhiata a questo: 

        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
    <!-- saved from url=(0053)http://apptools.com/examples/tables/standardscss.html -->
    <html><head><title>standards compliance mode with css rendering</title>
    <meta content="text/html; charset=iso-8859-1" http-equiv=content-type>
    <meta content=no http-equiv=imagetoolbar>
    <meta name=mssmarttagspreventparsing content=true>
    <style type=text/css>body {
        padding-bottom: 0px; background-color: #fff; margin: 0px; padding-left: 0px; padding-right: 0px; color: #000; padding-top: 0px
    }
    table {
        border-bottom: #008 1px solid; border-left: #008 1px solid; border-top: #008 1px solid; border-right: #008 1px solid
    }
    html {
        height: 100%
    }
    body {
        height: 100%
    }
    .fullheight {
        height:100%
    }
    </style>

    <meta name=generator content="mshtml 8.00.6001.18876"></head>
    <body>
    <table width=450 bgcolor=#ccccff align=center height="100%">
      <tbody>
      <tr>
        <td colspan="2" height="200px">
          <p>paragraph</p>
    </td></tr>
      <tr class="fullheight"><td >
      <p>paragraph</p>
      </td>
      <td>
      <p>paragraph</p>
      </td>
      </tr>


      </tbody></table></body></html>

Nessuna soluzione corretta

Altri suggerimenti

Umm ... quello che stai chiedendo può entrare in territorio complicato, ma mi piacerebbe iniziare con l'eliminazione incongruenze nel codice. Ad esempio:

  • La tavola è al 100% di altezza.
  • Al suo interno, si dispone di un alto <td> 200px all'interno di uno <tr>
  • All'interno, hai anche un alto secondo <tr> 100%

Quindi stai dicendo il codice che il 100% + 200px = 100%. Che non riesce logicamente, anche se si potrebbe desiderare di incidere il vostro codice in questo modo a volte.

In primo luogo, provare a regolare le proprietà in modo che funzionino in modo logico e cercare di ridurre il codice per una maggiore semplicità, e poi il tuo lavoro da lì. Dopo di che, se appare ancora una barra di scorrimento, sarà probabilmente necessario iniziare tweaking con margini negativi. Questo otterrà così "intimo" con il codice che francamente nessuno consigliando si avrebbe bisogno di un chiaro senso dei vostri obiettivi, piuttosto che fornire consigli su elementi di codice singoli.

Se il problema è la barra di scorrimento, è possibile utilizzare il CSS "overflow" attributo al fine di forzare il comportamento:

  • visibile: l'overflow non viene troncato. Rende al di fuori di dialogo dell'elemento. Questa è l'impostazione predefinita;
  • nascosto: l'overflow è ritagliato, e il resto del contenuto sarà invisibile;
  • di scorrimento: l'overflow è ritagliato, ma viene aggiunta una barra di scorrimento per vedere il resto del contenuto;
  • Auto: se trabocco è ritagliato, un scroll-bar deve essere aggiunto per vedere il resto del contenuto.
Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top