ugrás a tartalomhoz

két cella fix legyen

domel · 2009. Már. 15. (V), 00.17
Üdv!
Van egy táblám ahol két cellának fixnek kell lenni, a többi nyúlhat:
  1. <table style="table-layout: fixed;" border="1" width="714" height="333">  
  2.     <tr>  
  3.         <td width="464" colspan="2" height="48" bgcolor="#FF0000">a</td>  
  4.         <td width="234" rowspan="3"><p>a<p>a<p>a<p>a<p>a<p>a<p>a<p>a<p>a<p>a<p>a<p>  
  5.         a</td>  
  6.     </tr>  
  7.     <tr>  
  8.         <td width="464" colspan="2" height="31" bgcolor="#FF0000">b</td>  
  9.     </tr>  
  10.     <tr>  
  11.         <td width="228">a</td>  
  12.         <td width="230">a</td>  
  13.     </tr>  
  14. </table>  
ami Opera-Firefoxban azt csinálja, amit akarok:
http://www.extrabit.hu/spessart/v1.jpg
de IE8 alatt ilyen lett
http://www.extrabit.hu/spessart/v2.jpg

Van valakinek ötlete? Már órák óta ezzel szenvedek

Üdv! Domel
 
1

css játszik?

eashlon · 2009. Már. 15. (V), 05.16
gondolom ragaszkodsz a táblázatokhoz, különben css-el csinálnád.
összedobtam egy 3 percest, lehet szidni, későn van(korán?)
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-en">  
  3. <head>  
  4. <title>css proba</title>  
  5. <meta http-equiv="Content-Type" content="application/xhtml; charset=utf-8" />  
  6.   
  7.   
  8. <style type="text/css">  
  9. html,body{padding:0margin:0 autowidth:714pxheight:333pxborder:#000000 1px solid}  
  10. h3padding:0margin:0}  
  11. #wrap{}  
  12. #fix{width:464pxheight:46pxbackground-color:#FF0066}  
  13. #fix2{width:464pxheight:31pxbackground-color:#FF0033}  
  14. #oszlop1{background-color:#CCFFFFfloatrightwidth:236px;}  
  15. #oszlop2{background-color:#CCFFCCfloatleftwidth:230px;}  
  16. #oszlop3{background-color:#CCFF99floatleftwidth:233px;}  
  17. #clearclear:both;}  
  18. </style>  
  19. </head>  
  20. <body>  
  21. <div id="wrap">  
  22. <div id="oszlop1"><h3>oszlop1</h3><p>Lorem Ipsum Dolor Amet szója narráció előkelőség laptop alhálózat Külsős Alszekció Fájl Reláció Utánközlés gyáriparos vadon ügyvédség zsidókérdés input ókeresztény vadon effektus portabilitás gyorsindító harmonizáció magánvállalkozás másfélszeres assembly külpiac . zöldterület legitimitás magánvállalkozás konverzió leporelló Olaj Szórvány Beállítás Mikroszámítógép Szkenner főiskolás pluralista origami adminisztrátor disztribúció idegenvezetés művesség konverzió szuperszámítógép printer Output Doksi Melegindítás Implementáció Mikrocsip előképzettség tenyésztelep embléma vizualizáció  s Ökoturizmus Illetőség Értelmezett program Konstruktor Flopi aljegyző alpont alrész partíció implementáció aljegyző origami alközpont terabit assembly tenyésztelep narráció ezrelék gyorsmenü gyorsrendezés .</p>  
  23. </div>   
  24. <div id="fix"><h3>fenti fix</h3>  
  25. </div>      
  26. <div id="fix2"><h3>lenti fix</h3>   
  27. </div>  
  28. <div id="oszlop2"><h3>oszlop2 oda</h3><p>Lorem Ipsum Dolor Amet licit titkosrendőrség terminál destruktor Basic Aljegyző Alpont Alrész Partíció Implementáció aljegyző origami alközpont terabit assembly tenyésztelep narráció ezrelék gyorsmenü gyorsrendezés agrártámogatás kompatibilitás internet assembler dekóder . szoci almappa hidegindítás közteskód szkenner Koordinátor Újulat Agrárkamara Nagyhercegség Merevlemez alrész pixel flexibilitás szintaxis szubrutin külsős origami internet gyorsformázás diszk </p>  
  29. </div>   
  30. <div id="oszlop3"> <h3>oszlop3 amoda</h3><p>Lorem Ipsum Dolor Amet túlkínálat agrárágazat magánvállalkozás alközpont alrész Középiskolás Koordinátor Újulat Szegmentáció Testreszabás aktuálpolitika vadon zsellérség értelmezett program licenc pultosnő aktuálpolitika vasművesség e-mail gyorsformázás specializáció magánvállalkozás partíció vizualizáció printer . hosszútávfutó összpontszám terabit vonalkiemelés flopi Modem Kurzor Gyorsbillentyű Rekurzió Iteráció idegenvezetés tisztifőorvos spiritualitás </p>  
  31. </div>  
  32. </div>   
  33. <div id="clear">&nbsp;</div>  
  34. </body>  
  35. </html>  
1, bocsi, h hosszú
2, a luk a border szélesség miatt van (lusta voltam újraszámolni)
3, sokat lehetne még finomítani
4, remélem valamit segít
2

hümm

domel · 2009. Már. 15. (V), 14.40
fú ez nekem irtó kínai :) valami jobban átlátható megoldás nem létezik? :)
3

Megfelel(ő)

Poetro · 2009. Már. 15. (V), 16.54
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">  
  3. <head>  
  4.   <title>fluid-fixed</title>  
  5.   <style type="text/css">  
  6.     table#fluid-fixed {  
  7.       height: 333px;  
  8.       /*table-layout: fixed;*/  
  9.       width: 714px;  
  10.       border-collapse: collapse;  
  11.     }  
  12.     table#fluid-fixed td {  
  13.       font-weight: bold;  
  14.       text-align: center;  
  15.       margin: 0;  
  16.       padding: 0;  
  17.     }  
  18.     td.fixed1 {  
  19.       height: 48px;  
  20.       background-color: #f00;  
  21.       color: white;  
  22.       width: 464px;  
  23.     }  
  24.     td.fixed2 {  
  25.       height: 31px;  
  26.       background-color: #d00;  
  27.       color: white;  
  28.       width: 464px;  
  29.     }  
  30.     td.fluid1 {  
  31.       background-color: blue;  
  32.       color: white;  
  33.       width: 250px;  
  34.     }  
  35.     td.fluid2 {  
  36.       background-color: #ccf;  
  37.       width: 228px;  
  38.     }  
  39.     td.fluid3 {  
  40.       background-color: #bbd;  
  41.       width: 236px;  
  42.     }  
  43.     tr.fluid {  
  44.       height: 254px;  
  45.     }  
  46.   </style>  
  47. </head>  
  48. <body>  
  49. <table summary="" id="fluid-fixed">  
  50.   <tbody>  
  51.     <tr>  
  52.       <td class="fixed1" colspan="2">a</td>  
  53.       <td class="fluid1" rowspan="3">c</td>  
  54.     </tr>  
  55.     <tr>  
  56.       <td colspan="2" class="fixed2">b</td>  
  57.     </tr>  
  58.     <tr class="fluid">  
  59.       <td class="fluid2">d</td>  
  60.       <td class="fluid3">e</td>  
  61.     </tr>  
  62.   </tbody>  
  63. </table>  
  64. </body>  
  65. </html>  
4

ez is

domel · 2009. Már. 15. (V), 19.17
Sajnos ebben is szétcsúszik a fix piros cellák, ha a kék mezőbe teszek 50 sor valamit, de azóta rájöttem, hogy a két szürke cellával fogom nyújtani a táblát, a kék cellába meg mindig annyi dolgot teszek, ami pont belefér. Köszi a segítségeteket!

Domel
5

ja

domel · 2009. Már. 15. (V), 20.51
Eashlon-féle megoldás mégis csak hasznos volt, mert rájöttem, hogy a táblákat is simán lehet float-olni, így most minden cella helyére tábla (egycellás) került, amit arra az oldalra teszek, amelyikre akarok, és nem lesz a szétcsúszás lehangoló élménye, és az a 9-10 tábla (cella) meg még kibírható egy böngésző számára.
Üdv!
Domel