<table> problem

28.3.2010 11:50 | Přečteno: 1192× | nazařaditelné

...aneb potřeboval bych pomoct rozlousknout jeden takovej problém se slučovánim buněk tabulky v HTML.
Už se s tim seru od pátku a pořád nemůžu najít schůdné (no, upřímě řečeno spíš "jakékoliv") řešení. Ale k věci, mám tabulku se čtyřmi buňkami, z nihž tři potřebuju spojit:

• A1, A2
• B1, B2

Problém nastává v tom, že potřebuju spojit A1, B1 a B2, čili získat obrazec o tvaru písmena L (první nákres), což se pravděpodobně nedá...
Protože mi jde o dizajnování stránky (buněk je horizontálně i vertikálně 8, celá stránka má 1000x"*"px a mně jde o poslední dva řádky) a nebude vidět rámeček, přicházela by vhod i varianta druhá a to sdílení obsahu z buněk A1 a B1 s buňkou B2 (druhý nákres), kde by to teoreticky i jít mohlo, ale taky mně nenapadá způsob, jak to zařídit. Celkem už mi s toho psaní leze hlava kolem, včera jsem se asi dvě hodiny vstekal, že mi nefunguje základní formátování (width/widht + height/heigth ) a dneska už do toho kódu čumim už úplně jak husa do flašky...

Předem díky za jakejkoliv nápad. Jestli se ptáte proč nepoužiju CSS, odpověď je jednoduchá: v těch základních věcech se orientuju, ale až takhle tomu zas nerozumim...        

Obrázky

Komentáře

[Jan Drábek]

Tohle tabulkou opravdu nepůjde, ale použit konstrukci

<div>
<div style="width: 200px; height: 200px; float: left; margin:10px;">Tady je to co má být prázdné.</div>

Tady je ten text do L.

</div>

By mělo fungovat.

[Jan Drábek]

Ehm, samozřejmě float: right;

[=^..^= AmigaPower®]

Nojo, ale já do toho prázdnýho místa musim dát měnící-se (onmouseout atd.) obrázek s odkazem, to je ten prů...

[kotyz]

to sem zvedavej co to bude az to bude

[=^..^= AmigaPower®]

...počkej, já sem už úplně vygumovanej Já to celý můžu hodit do tý tabulky, ne? S tim, že kdybych potřeboval další takový okýnko na další obrázek hned pod timhle, dám si do tý tabulky jen další takovej div, ne?

[=^..^= AmigaPower®]

hehe, vypadá to funkčně jen teď ještě potřebuju obrázku nastavit margin 0 a textu 10, jde to tam nějak podělit?

[mess]

Tak v tom případě doporučuju něco takového:

<div id="obal" style="position: relative;">
  <div id="levy_ramecek" style="float: right; width: 100px; height: 100px; margin: 0px 0px 5px 5px;"></div>
  Sem přijde normální text stránky, který chceš mít vedle toho rámečku
  <div style="clear: right;">
    Sem přijde to, co chceš měnit. Díky tomu "clear" se zobrazí až pod tím floatujícím rámečkem.
  </div>
</div>

[=^..^= AmigaPower®]

dík, ale já to zkusim až zejtra, teď už sem si dal brko.

[Jirka]

Ten prázdný div může mít nastaven CSS styl tak, že ta třída, která ho definuje bude mít na pozadí obrázek a k tomu dále nadefinovat pseudo třídu :hover, která bude mít nastavené pozadí, na které se to má změnit.

Pak ani není třeba JavaScript.

[=^..^= AmigaPower®]

já to dělám "onmouseover" a "onmouseout", javascript mam akorát na ty posr... průhledný png v IE.

[Václav HFechs Švirga]

Jen je tuším problém s IE6, tam funguje hover jen u odkazu.

[Jendа]

7,7 % a klesá → neřešit.

[Bruce]

Ale houby, este menej :)

http://gs.statcounter.com/#browser_version-CZ-monthly-201001-201003

[Jendа]

Tak jsou na tom v zahraničí ještě lépe. Já jsem se díval do českého TopListu.

[MaFy]

A taky s pruhlednym png obrazkem

[vlastikroot]

U IE6 je problém s jakýmkoli renderingem čehokoliv, kde není jen H1 a A.

[MaFy]

Hezky receno

[Josef Kufner]

Hm, a že to nedáš do poradny?

Jinak <table> to neumí a nejschůdnější cesta je opravdu přes floatící divy.

[=^..^= AmigaPower®]

Do programovací? Škoda místa, tam se řešej opravdový problémy, já si v podstatě jen hraju. Ještě že ty divy jsou...