时间戳

首页 > 解决方案 > td 包含图像或文本时垂直对齐

php - td 包含图像或文本时垂直对齐

问题描述

这是我的问题。我可以查看vertical center所有内容，除非没有图像且显示文本。Antec Leyden b.v.中间没有显示文字

我尝试了不同的代码，结果都一样。

1.

if(!empty($find_logo[0])) { echo '<td><img src="'.$find_logo[0].'" height="35"/></td>'; } else { echo '<td style="vertical-align:middle">'.$row_table_1['leverancier'].'</td>'; }

2.

<td style="vertical-align:middle">'; if(!empty($find_logo[0])) { echo '<img src="'.$find_logo[0].'" height="35"/>'; } else { echo $row_table_1['leverancier']; } echo '</td>

3.

<td>'; if(!empty($find_logo[0])) { echo '<img src="'.$find_logo[0].'" height="35"/>'; } else { echo '<span style="vertical-align:middle">'.$row_table_1['leverancier'].'</span>'; } echo '</td>

这是我原来的表

echo'
    <tr>
        <td class="text-center">'; if(!empty($find_image[0])) { echo '<img src="'.$find_image[0].'" height="35"/>'; } echo '</td>
        <td style="vertical-align:middle">'; if(($row_table_1['aantal_huidig'] < $row_table_1['aantal_min_1']) && $row_table_1['in_bestelling'] == 0) { echo '<span style="color:#DC3545 !important;"><i class="fas fa-exclamation-triangle"></i></span> '; }
               elseif(($row_table_1['aantal_huidig'] < $row_table_1['aantal_min_2']) && $row_table_1['in_bestelling'] == 0) { echo '<span style="color:#FFC107 !important;"><i class="fas fa-exclamation-triangle"></i></span> '; }
               echo $row_table_1['artikelnr'].'</td>
        <td style="vertical-align:middle">'.$row_table_1['omschrijving'].'</td>
        <td style="vertical-align:middle">'.$row_table_1['groep'].'</td>
        <td style="vertical-align:middle" align="center">'; if($row_table_1['aantal_huidig'] > 0) { echo $row_table_1['aantal_huidig']; } echo '</td>
        <td style="vertical-align:middle" align="center">'; if($row_table_1['in_bestelling'] > 0) { echo $row_table_1['in_bestelling']; } echo '</td>
        <td style="vertical-align:middle" align="center">'; if($row_table_1['bestelhoeveelheid'] > 0) { echo $row_table_1['bestelhoeveelheid']; } echo '</td>
        <td style="vertical-align:middle" align="center">'; if($row_table_1['aantal_huidig'] < $row_table_1['aantal_min_1'] && $row_table_1['in_bestelling'] == 0) { echo '<a href="#"><span class="fas fa-shopping-cart" data-toggle="modal" data-target="#modal_add_mag_table_1'.$i.'" data-backdrop="static" data-keyboard="false" data-toggle="tooltip" title="Maak bestelling"></span></a>'; } echo '</td>
        <td>'; if(!empty($find_logo[0])) { echo '<img src="'.$find_logo[0].'" height="35"/>'; } else { echo $row_table_1['leverancier']; } echo '</td>
        <td style="vertical-align:middle" class="text-center"><a href="#"><span class="glyphicon glyphicon-pencil" data-toggle="modal" data-target="#modal_edit_table_2'.$i.'" data-backdrop="static" data-keyboard="false" data-toggle="tooltip" title="Bewerk"></span></a> <a href="magazijn_label.php?id='.$row_table_1['id'].'" target="_blank"><span class="fas fa-tag" title="Print label"></span></a></td>
    </tr>';

有什么建议么？

标签： phphtmlcss

解决方案

为什么不使用：

<td style="vertical-align:middle">'; if(!empty($find_logo[0])) { echo '<img src="'.$find_logo[0].'" height="35"/>'; } else { echo $row_table_1['leverancier']; } echo '</td>
   |------------------------------|

即使它在所有其他<td>s 中，您也没有添加它。

或者，由于您知道图像高度是height="35"（根据您的代码），然后line-height: 35px;为该单元格应用（CSS）。使用 line-height 是一种普遍接受的做法，当它们在一行中时将文本垂直居中，但如果事先不知道高度，那么它就不起作用。

推荐阅读