Šta je novo?

IE7 Standards mode: naterati div da se širi zavisno od contenta

jddipqd

Čuven
Učlanjen(a)
17.10.2000
Poruke
2,529
Poena
725
Imam strukturu koja izgleda ovako:

Kod:
<div class="container wide">
    <div class="center wide">
        <fieldset>
            <table class="search-results-table">
                <thead>
                    <tr>
                        <td colspan="18">...</td>
                    </tr>
                    <tr>
                        <th class="col1">...</th>
                        ...
                        <th class="col18">...</th>
                    </tr>
                </thead>
                <tfoot>
                    <tr>
                        <td colspan="18">...</td>
                    </tr>
                </tfoot>
                <tbody>
                    <tr>
                        <td class="col1" >...</td>
                        ...
                        <td class="col18" >...</td>
                    </tr>
                    ...
                </tbody>
            </table>
        </fieldset>
    </div>
</div>

Prateći css je:
Kod:
.container {
    margin: 8px;
    text-align: center;
}

.center {
    margin-left: auto;
    margin-right: auto;
    min-width: 800px;
    width: expression(document.body.clientWidth < 800? "800px": "auto");
    text-align: center;
    padding: 10px;
}

.wide {
    width: auto;
    display: table;
}

Potrebno je da container div zauzima 100% širine ekrana ako je tabela uža od ekrana, odnosno da se širi po horizontali koliko je potrebno ako je tablela šira od ekrana (uz prikazivanje horizantalnog scrolla u browseru).

Dimenzije container diva se ne mogu ograničiti pošto tabela nema fiksnu širinu kolona, već se ona određuje at runtime (na server strani, primenom dodatnih klasa ili sa style="width: " na td i th, zavisno od slučaja.

Stranica je validan xhtml strict.

IE6 zbog svojih bagova automatski širi div (i ko još kaže da bagovi ne valjaju :d). U Firefoxu je problem rešio display: table, ali za IE7 u standard modu nikako ne uspevam.
Kako naterati IE7 da ovo ovako renderuje? Naravno bez toga da ga namerno oteram u quirks (mada ako ništa drugo ne pomogne... :) )
 
Pre svega ja uopste nisam razumeo sta zelis da postignes. Kakve sirine, kakve horizontale...
Znaci ako ti je ta tablea MANJA od ekrana, onda ti hoces da se razvuce? Pretpostavljam da si to hteo?

Moj savet ti je da izbacis te IE hackove i uradis taj deo skroz u tabeli, ako ti vec tako nesto treba. Na drugoj strani tebi je IE vec u Quirks modu cim ima xhtml.

PS
Ja kazem da bagovi u IEu ne valjaju. :)
 
Poslednja izmena:
overflow: auto;

to ti fali u CSSu. Kod mene radi posao.
 
Poslednja izmena:
Pre svega ja uopste nisam razumeo sta zelis da postignes. Kakve sirine, kakve horizontale...
Znaci ako ti je ta tablea MANJA od ekrana, onda ti hoces da se razvuce? Pretpostavljam da si to hteo?

Moj savet ti je da izbacis te IE hackove i uradis taj deo skroz u tabeli, ako ti vec tako nesto treba. Na drugoj strani tebi je IE vec u Quirks modu cim ima xhtml.

PS
Ja kazem da bagovi u IEu ne valjaju. :)

Ne.
Kada je tabela manja od ekrana, min-width ili expression odrade posao i sve je ok.
Problem je kada je tabela veća od ekrana. U tom slučju hoću da se container koji je okružuje razvuče da je obuhvati celu, a ne da tabela izbije iz njega.

IE nije u Quirks modu (čak ni IE6, i on regularno guta xhtml strict doctype - međutim standard mod nije isti kod IE6 i kod IE7).

Evo screenshotova. Gornji container je širine ekrana, a ekran je odskrolovan udesno.
Kao na prvom izgleda u FF, IE6 Standard, IE6 Quirks, IE7 Quirks
Kao na drugom izgleda u IE7 Standard.
 

Prilozi

  • quirks.png
    quirks.png
    7.8 KB · Pregleda: 62
  • standard.png
    standard.png
    8.6 KB · Pregleda: 65
overflow: auto;

to ti fali u CSSu. Kod mene radi posao.

To sam već probao. Kod mene to postavi skrol na div koji hoću da se proširi, tako da mogu da skrolujem unutar njega.
Problem je što u slučaju kada je tabela dovoljno visoka, taj skrol ode izvan ekrana.
 
Poslednja izmena:
Pošto su se rokovi primakli, a ništa drugo nije pomoglo, problem je rešilo stavljanje
Kod:
<!--[if IE 7]><span></span><![endif]-->
ispred doctype-a.
Jeste prljavo, al radi posao :)
 
To sto si uradio, koliko je meni poznato, ne tvrdim da je 100% tacno, ali podseca me na resavanje Quirks Mod problema. Da ne ispadne da se ponavljam, recicu da nisam 100% siguran.
 
Nazad
Vrh Dno