0

对不起这里的长度。我正在使用 oscommerce 并有一个页面，其中包含我们所有的产品特价商品，这些商品都放在一个 3 列的表格中。我需要调整每种产品的价格，以便所有价格在屏幕上相互对齐。

从视觉上看，这就是我想要的：

|-----------------------|
| Image | Image | Image |
| Title | Long  | Very, |
|       | Title | very, |
|       |       | long  |
|       |       | title |
|$19.99 |$29.99 |$139.00|
|-----------------------|

目前，这是现有代码生成的内容：

|-----------------------|
| Image | Image | Image |
| Title | Long  | Very, |
| $19.99| Title | very, |
|       |$29.99 | long  |
|       |       | title |
|       |       |$139.00|
|-----------------------|

这是目前的代码：

<table border="0" width="100%" cellspacing="0" cellpadding="2">
  <tr>
<?php
$column = 0;
$specials_query = tep_db_query($specials_split->sql_query);
while ($specials = tep_db_fetch_array($specials_query)) {
  $column ++;
  echo '<td align="center" width="33%" class="productListing-data" valign="top">
    <div class="prodimagebox"><a href="' . tep_href_link(FILENAME_PRODUCT_INFO, 
    'products_id=' . $specials['products_id']) . '">' . tep_image(DIR_WS_IMAGES . 
    $specials['products_image'], $specials['products_name'], SMALL_IMAGE_WIDTH, 
    SMALL_IMAGE_HEIGHT) . '</a></div><br><a href="' . 
    tep_href_link(FILENAME_PRODUCT_INFO, 'products_id=' . $specials['products_id']) 
    . '">' . $specials['products_name'] . '</a><br>' 
    . $currencies->display_price($specials['specials_new_products_price'],
    tep_get_tax_rate($specials['products_tax_class_id'])) . '</td>' . "\n";

  if ((($column / 3) == floor($column / 3))) {
?>
    </tr>
      <tr>
        <td><?php echo tep_draw_separator('pixel_trans.gif', '100%', '10'); ?></td>
      </tr>
      <tr>
<?php
  }
}
?>
  </tr>
</table>

我试图编写一些代码来写出图像和标题，然后将我们带回数组中的 3 步。接下来是一个新行，然后是三个包含上述产品价格的新列，一个分隔符，然后从那里继续。

这样一来，无论标题大小如何，价格都将彼此垂直对齐。我正在通过多个嵌套循环，但仍然没有接近我的最终结果。

帮助将不胜感激。

4

1 回答 1

0

你应该把描述和价格放在两个不同div的s中：

<style>
  td.productListing-data div.item_wrapper {
    position: relative;
  }
  td.productListing-data div.item_wrapper div.item_description {
    margin-bottom: 15px;
  }
  td.productListing-data div.item_wrapper div.item_price {
    position: absolute;
    bottom: 0;
    height: 15px;
  }
</style>

<td align="center" width="33%" class="productListing-data" valign="top">
  <div class="item_wrapper">
    <div class="item_description">
      <!-- the description -->
    </div>
    <div class="item_price">
      <!-- the price -->
    </div>
  </div>
</td>

我刚刚创建了一个示例，您需要做的就是将它用于您的表创建。

于 2010-06-21T18:34:32.937 回答