Avaleht
uus teema   vasta Tarkvara »  WWW »  FF3 css bug - lahendus/workaround? märgi kõik teemad loetuks
märgi mitteloetuks
vaata eelmist teemat :: vaata järgmist teemat
Hinnavaatlus :: Foorum :: Uudised :: Ärifoorumid :: HV F1 ennustusvõistlus :: Pangalink :: Telekavad :: HV toote otsing
autor
sõnum Saada viide sõbrale.  :: Teata moderaatorile teata moderaatorile
otsing:  
tanzanite
HV kasutaja
tanzanite

liitunud: 13.05.2006




sõnum 02.08.2008 09:14:25 FF3 css bug - lahendus/workaround? vasta tsitaadiga

Täielik testkood allpool.

* max-height ei tööta ja height on kasutuskõlbmatu kui ridu liiga vähe.
* tabeli lahtrite raamistik joonistatakse väljapoole tabelit.
* tabeli lahtrite raamistiku ei joonistata tabeli sisse (lolz - way to go ff!).

Kuidas siis ikkagi soovitud effecti saavutada? Ehk minimeerida tabeli nähtavat kõrgust (ja ilma päise peitmiseta) KUI see liiga suur on?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style type="text/css">
html { margin: 8px; padding: 0px; }
body { margin: 0px; padding: 0px; }
table { empty-cells: show; border-collapse: collapse; }
td, th { padding: 0px 0px; border: 1px solid #aaf; }
th { text-align: center; }
tr:hover { outline: 1px solid red; }
thead { background-color: #ddf; }
tbody { background-color: #eef; }
.bar { width: 100%; margin: 0.1em auto; margin-bottom: 0.1em; }
.bar th { width: 2em; }
.foo { text-align: center; width: 10em; }
.body { clear: both; padding-top: 8px; }

/* problemspot */
.bar2 tbody {
  height: 5em; /* see pole kasutuskõlblik kui ridu on liiga vähe - aga vähemalt toimib pisut */
  max-height: 5em; /* seda on vaja - aga ei tööta üldse */
  overflow: scroll;
  overflow-x: hidden; /* ei oma bugi juures mingit effecti */
}

</style>
<title></title></head><body><div class="body">

<!-- problemspot a => complete fuckup -->
<table class="bar bar2">
  <thead><tr><td>bla</td><td>bla</td><td>bla</td><th>bla</th><td>bla</td></tr></thead>
  <tbody>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
  </tbody>
</table>

<br />

<!-- problemspot b => complete fuckup -->
<table class="bar bar2">
  <thead><tr><td>bla</td><td>bla</td><td>bla</td><th>bla</th><td>bla</td></tr></thead>
  <tbody>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
  </tbody>
</table>

<br /><br /><br /><br /><br /><br /><br /><br />

<!-- milline tabel tegelikult olema peaks -->
<table class="bar">
  <thead><tr><td>bla</td><td>bla</td><td>bla</td><th>bla</th><td>bla</td></tr></thead>
  <tbody>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
  </tbody>
</table>

</div></body></html>


PS! IE eksistentsiga ei ole vaja mitte mingiligi määral arvestada - ega ka ühegi teise nö mitte-brauseriga.
tagasi üles
vaata kasutaja infot saada privaatsõnum
andrusny
Kreisi kasutaja
andrusny

liitunud: 20.03.2006




sõnum 02.08.2008 11:52:02 vasta tsitaadiga

Äkki nii

<div style="height:5em; overflow: hidden; overflow-y: scroll; ">
<!-- problemspot b => complete fuckup -->
<table class="bar bar2">
  <thead><tr><td>bla</td><td>bla</td><td>bla</td><th>bla</th><td>bla</td></tr></thead>
  <tbody>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
  </tbody>
</table>
</div>

_________________
Kommentaarid: 7 loe/lisa Kasutajad arvavad:  :: 0 :: 0 :: 7
tagasi üles
vaata kasutaja infot saada privaatsõnum mine selle kasutaja kodulehele
DoS
HV veteran
DoS

liitunud: 19.08.2002




sõnum 03.08.2008 17:03:19 vasta tsitaadiga

andrusny, see peidab päise, kui scrollida.

tanzanite, kui border-collapse maha võtad, siis midagi läheb paremaks, aga soovitan vaadata http://www.imaputz.com/cssStuff/bigFourVersion.html kus cssis on päris hästi kommenteeritud ka, miks ja mida vaja teha.
Kommentaarid: 50 loe/lisa Kasutajad arvavad:  :: 0 :: 0 :: 47
tagasi üles
vaata kasutaja infot saada privaatsõnum
andrusny
Kreisi kasutaja
andrusny

liitunud: 20.03.2006




sõnum 03.08.2008 17:19:37 vasta tsitaadiga

Päis tee ennem seda eraldi div sisse või tabelisse.


<table class="bar bar2">
  <thead><tr><td>bla1</td><td>bla2</td><td>bla3</td><th>bla4</th><td>bla5</td></tr></thead>
</table>
<div style="height:5em; overflow: hidden; overflow-y: scroll; ">
<!-- problemspot b => complete fuckup -->
<table class="bar bar2">
 
  <tbody>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
    <tr><td class="foo">foo</td><td class="foo">foo</td><td style="width: 10em;"></td><td></td><td></td></tr>
  </tbody>
</table>
</div>

_________________
Kommentaarid: 7 loe/lisa Kasutajad arvavad:  :: 0 :: 0 :: 7
tagasi üles
vaata kasutaja infot saada privaatsõnum mine selle kasutaja kodulehele
tanzanite
HV kasutaja
tanzanite

liitunud: 13.05.2006




sõnum 05.08.2008 06:50:58 vasta tsitaadiga

DoS: tänud aga paraku on lingitu kasutuskõlbmatu icon_sad.gif
* fikseeritud tabel / lahtrid ja nende lahendus baseerub sellel
See border-collapse oli küll huvitav leid ... not happy with it tho icon_sad.gif

andrusny: Tegemist on 100% javascripti rakendusega (+tibake phpd ajaxi tarbeks) - seega olen väga vaenulik kogukate html hackide suhtes - üks lisadiv on ok (sellistest asjadest praeguse css arengutaseme [arengupeetuse] juures pole paraku pääsu) - pakutu on aga juba liiast. Ja paraku eeldab fikseeritud lahtreid. icon_sad.gif

Probleemist ollakse muidu teadlikud FF poolel ja paistab, et sellega ka juba tegeletakse ( https://bugzilla.mozilla.org/show_bug.cgi?id=423823 https://bugzilla.mozilla.org/show_bug.cgi?id=307866 jne ). Paistab FF3 only kala olevat (pole kontrollinud aga sellist väidet kohtasin). Paistab, et ega vist muud üle jää kui oodata parandust icon_sad.gif Hetkel näeb asi üsna nutune välja ( https://bugzilla.mozilla.org/attachment.cgi?id=329428 / https://bugzilla.mozilla.org/attachment.cgi?id=311195 )
tagasi üles
vaata kasutaja infot saada privaatsõnum
näita postitusi alates eelmisest:   
uus teema   vasta Tarkvara »  WWW »  FF3 css bug - lahendus/workaround?
[vaata eelmist teemat] [vaata järgmist teemat]
 lisa lemmikuks
näita foorumit:  
 ignoreeri teemat 
sa ei või postitada uusi teemasid siia foorumisse
sa ei või vastata selle foorumi teemadele
sa ei või muuta oma postitusi selles foorumis
sa ei või kustutada oma postitusi selles foorumis
sa ei või vastata küsitlustele selles foorumis
sa ei saa lisada manuseid selles foorumis
sa võid manuseid alla laadida selles foorumis



Hinnavaatlus ei vastuta foorumis tehtud postituste eest.