CodeIgniter Forums
Table Row Height Intermittent - Printable Version

+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: Using CodeIgniter (https://forum.codeigniter.com/forumdisplay.php?fid=5)
+--- Forum: General Help (https://forum.codeigniter.com/forumdisplay.php?fid=24)
+--- Thread: Table Row Height Intermittent (/showthread.php?tid=81533)



Table Row Height Intermittent - jdmdigital - 03-15-2022

Using CI3; have addjusted CSS a few times and still have the issue; wondering if its a CI matter.
Issue:  99/100 times, the table header row and first data row heights are consistent with the other rows. All other times, the header row and first data row height is much larger and the data in the last column is at the top of the cell while the other data in other columns are centered. 
Any known issue surrounding this? Any ideas if not a CI matter?
Thanks,
JDM


RE: Table Row Height Intermittent - ignitedcms - 03-15-2022

It's a CSS/HTML issue, also depends if one bit of data ('no. of text characters') is much more than the others


RE: Table Row Height Intermittent - jdmdigital - 03-16-2022

(03-15-2022, 11:38 AM)ignitedcms Wrote: It's a CSS/HTML issue, also depends if one bit of data ('no. of text characters') is much more than the others

Hello and thank you. Appreciate the hint...as mentioned, I looked at the CSS/HTML i could think of. Is there anything specific you would look into on CSS/HTML for this?

The # of chars in the header row are static and the suspicious column cell only contains "Total" (fewer than the other characters), and the first data row suspicious column cell is only 7 digits which is same as most other rows. 

Thanks for any further insight you may have.

R,
JDM


RE: Table Row Height Intermittent - ignitedcms - 03-16-2022

Is it possible to paste the html and css here and I can have a look?


RE: Table Row Height Intermittent - jdmdigital - 03-16-2022

(03-16-2022, 10:25 AM)ignitedcms Wrote: Is it possible to paste the html and css here and I can have a look?

Absolutely...

**CSS**

Code:
table.item-table{width:100%;border-collapse:collapse;border-spacing:0;margin-bottom:10px;font-size:12px}

table.item-table tr:nth-child(2n-1) td{background:#F5F5F5}

table.item-table th{padding:5px 0;border-bottom:1px solid #606060;white-space:nowrap;text-align:left}

table.item-table th.text-right{text-align:right}

table.item-table th.text-center{text-align:center}

table.item-table td{padding:5px 0}

table.item-table .invoice-sums{text-align:right;}

**HTML**



RE: Table Row Height Intermittent - ignitedcms - 03-16-2022

(03-16-2022, 11:34 AM)jdmdigital Wrote:
(03-16-2022, 10:25 AM)ignitedcms Wrote: Is it possible to paste the html and css here and I can have a look?

Absolutely...

**CSS**

Code:
table.item-table{width:100%;border-collapse:collapse;border-spacing:0;margin-bottom:10px;font-size:12px}

table.item-table tr:nth-child(2n-1) td{background:#F5F5F5}

table.item-table th{padding:5px 0;border-bottom:1px solid #606060;white-space:nowrap;text-align:left}

table.item-table th.text-right{text-align:right}

table.item-table th.text-center{text-align:center}

table.item-table td{padding:5px 0}

table.item-table .invoice-sums{text-align:right;}

**HTML**
Code:
<table class="item-table">
        <thead>
        <tr>
            <th class="item-name">Item #</th>
<th class="item-desc">Description</th>
            <th class="item-amount text-center">Qty<br>Ordered</th>
            <th class="item-amount text-center">Qty<br>Shipped</th>
<th class="item-amount text-center">Qty<br>Backordered</th>
            <?php if ($show_item_discounts) : ?>
<th class="item-discount text-right"><?php _trans('discount'); ?></th>
<?php endif; ?>
            <th class="item-price text-right"><?php _trans('price'); ?></th>
<th class="item-total text-right"><?php _trans('total'); ?></th>
        </tr>
        </thead>
        <tbody>

             
<tr>
                <td><?php echo $itemSKU->item_SKU; ?></td>
                <td><?php echo nl2br(htmlsc($item->item_name)); ?></td>
                <td class="text-center">
                    <?php echo number_format($item->item_quantity); ?>
                </td>
                <td class="text-center">
                    <?php echo number_format($item->item_qntshiped); ?>
                </td>
                <td class="text-center">
                    <?php echo number_format($item->item_qntbackord); ?>
                </td>
                <td class="text-center">
                    <?php echo format_currency($item->item_price); ?>
                </td>
                <?php if ($show_item_discounts) : ?>
                    <td class="text-right">
                        <?php echo format_currency($item->item_discount); ?>
                    </td>
                <?php endif; ?>
                <td class="text-right">
                    <?php echo format_currency($item->item_total); ?>
                </td>
            </tr>
        <?php } ?>

        </tbody>
        <tbody class="invoice-sums">

        <tr>
            <td <?php echo($show_item_discounts ? 'colspan="7"' : 'colspan="6"'); ?> class="text-right">
                <?php _trans('subtotal'); ?>
            </td>
            <td class="text-right"><?php echo format_currency($invoice->invoice_item_subtotal); ?></td>
        </tr>

        <?php if ($invoice->invoice_item_tax_total > 0) { ?>
            <tr>
                <td <?php echo($show_item_discounts ? 'colspan="7"' : 'colspan="6"'); ?> class="text-right">
                    <?php _trans('item_tax'); ?>
                </td>
                <td class="text-right">
                    <?php echo format_currency($invoice->invoice_item_tax_total); ?>
                </td>
            </tr>
        <?php } ?>

        <?php foreach ($invoice_tax_rates as $invoice_tax_rate) : ?>
            <tr>
                <td <?php echo($show_item_discounts ? 'colspan="7"' : 'colspan="6"'); ?> class="text-right">
                    <?php echo htmlsc($invoice_tax_rate->invoice_tax_rate_name) . ' (' . format_amount($invoice_tax_rate->invoice_tax_rate_percent) . '%)'; ?>
                </td>
                <td class="text-right">
                    <?php echo format_currency($invoice_tax_rate->invoice_tax_rate_amount); ?>
                </td>
            </tr>
        <?php endforeach ?>

        <?php if ($invoice->invoice_discount_percent != '0.00') : ?>
            <tr>
                <td <?php echo($show_item_discounts ? 'colspan="7"' : 'colspan="6"'); ?> class="text-right">
                    <?php _trans('discount'); ?>
                </td>
                <td class="text-right">
                    <?php echo format_amount($invoice->invoice_discount_percent); ?>%
                </td>
            </tr>
        <?php endif; ?>
        <?php if ($invoice->invoice_discount_amount != '0.00') : ?>
            <tr>
                <td <?php echo($show_item_discounts ? 'colspan="7"' : 'colspan="6"'); ?> class="text-right">
                    <?php _trans('discount'); ?>
                </td>
                <td class="text-right">
                    <?php echo format_currency($invoice->invoice_discount_amount); ?>
                </td>
            </tr>
        <?php endif; ?>

        <tr>
                <td <?php echo($show_item_discounts ? 'colspan="7"' : 'colspan="6"'); ?> class="text-right">
                    Shipping
                </td>
                <td class="text-right">
                    <?php echo format_currency($invoice->invoice_shipping); ?>
                </td>
        </tr>

<tr>
            <td <?php echo($show_item_discounts ? 'colspan="7"' : 'colspan="6"'); ?> class="text-right">
                <b><?php _trans('total'); ?></b>
            </td>
            <td class="text-right">
                <b><?php echo format_currency($invoice->invoice_total); ?></b>
            </td>
        </tr>
        <tr>
            <td <?php echo($show_item_discounts ? 'colspan="7"' : 'colspan="6"'); ?> class="text-right">
                <?php _trans('paid'); ?>
            </td>
            <td class="text-right">
                <?php echo format_currency($invoice->invoice_paid); ?>
            </td>
        </tr>
        <tr>
            <td <?php echo($show_item_discounts ? 'colspan="7"' : 'colspan="6"'); ?> class="text-right">
                <b><?php _trans('balance'); ?></b>
            </td>
            <td class="text-right">
                <b><?php echo format_currency($invoice->invoice_balance); ?></b>
            </td>
        </tr>
        </tbody>
    </table>

I can't really test that, can you paste just dummy HTML without any PHP with the issue you are facing.


RE: Table Row Height Intermittent - jdmdigital - 03-16-2022

I will get dummy code for the test. Thanks again.

R,
JDM