Autor Zpráva
skaaj
Profil
Zdravim,

Na tomto webe je zoznam tovaru rieseny ako tabulka, kde kazdy riadok obsahuje tri polozky.
Problemom je zlty box v spodnej casti bunky, rad by som ho odsadil do rovnakej vysky pre vsetky polozky v riadku.

Skusal som boxy absolutne pozicovat na spodok riadku <tr>, toto riesenie vsak neviedlo k nicomu.

Nemate nejake napady ako na to?

Dakujem
Michal Benda
Profil
Stačí přidat další řádek <tr> pod řádek ve kterém je popis a tam dát ten zlatý box... tím že tam bude další řádek tak se ty boxy srovnají... Dělat ale výpis produktů pomocí tabulky je dost nepraktické... Co když jich bude víc a bude třeba je dávat pod sebe?
Pomocí tabulek bych to nedělal, ale jenom pomocí divů...

Udělal bych to takto:
<div class="produkt">
  <div class="fotoNazevACena"><img> atd.</div>
  <div class="popis">Popis produktu:sit amet, con... atd.</div>
  <div class="kosik"><input>... atd.</div>
</div>


To je kód pro každý produkt. Pak stačí v CSS všem produktům nastavit stejnou šířku a plovoucí umístění vlevo (.produkt {width:*px; float:left;}). Tím dostaneme to stejné, co už teďka na tom webu je a pak stačí všem popisům nastavit stejnou výšku, třeba tak velkou jak je ten popis u prostředního produktu (.popis {height:*px;})...
panther
Profil
skaaj:
ať tabulkou či bez (floatované bloky (ať div, nebo LI, je to přeci jen výpis/seznam produktů) vedle sebe), ty divy jsou tam zbytečné všechny.

Výhoda floatovaných netabulkových elementů vedle sebe bude, že v nich bude možno snáze pozicovat ke spodnímu okraji.

Michal Benda:
Stačí přidat další řádek <tr> pod řádek ve kterém je popis a tam dát ten zlatý box
tohle je snad nejhorší možné řešení. Je-li tabulkový výpis, celá položka by měla být v jedné buňce. Ne v několika řádcích.
Michal Benda
Profil
proto jsem psal, že bych to dělal pomocí divů... je to na skaajovi co si vybere
skaaj
Profil
@ panther jasne viem co mi chces povedat... rad by som vsak dosiahol efekt, ze tie 3 bunky vedla seba budu mat rovnaku dlzku...ak aj pouzijem nejake floatovane elementy, ako to dosiahnut?
skaaj
Profil
nakoniec si asi odpoviem sam :)

tie tri bunky spravim ako plavajuce elementy, teda napr DIV a cele ich obalim do vonkajsieho DIVu, ktoremu nastavim position:relative.
Vnutornym boxom v bunkach potom staci nastavit position:absolute; left:auto; bottom:0; a mam ich napozicovane na spodok tak ako som chcel.

ukazka:

<style> 
 .bunka{
      float:left;
      width: 200px;
 }
 .out{
     position:relative;
     padding-bottom:20px;
 }
 .box{
     positon:absolute;
     left:auto;
     bottom:0;
     height:20px;
 }  
 </style> 

<div class="out">
   <div class="bunka">
        bla bla bla...
       <div class="box"></div>
   </div>
   
   <div class="bunka">
        bla bla bla...
        bla bla bla...
        bla bla bla...
       <div class="box"></div>
   </div>

   <div class="bunka">
        bla bla bla...
        bla bla bla...
       <div class="box"></div>
   </div>
      
   <br style="clear:both" />
</div>

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: