HTML löst das Problem ungültiger Tabellenbreiteneinstellungen

HTML löst das Problem ungültiger Tabellenbreiteneinstellungen

Wenn Sie den Stil „table-layer:fixed“ für eine Tabelle festlegen und feststellen, dass eine Zeile in der Tabelle zusammengeführt wurde, werden die Spaltenbreiten der anderen Zeilen, die nicht zusammengeführt wurden, gemittelt und die Einstellung der Spaltenbreite wird ungültig.

Lösung:

Vor tbody hinzufügen

        <col style="Breite: 100px;"/>
        <Spalte>
        <col style="Breite: 100px;"/>
        <col style="Breite: 100px;"/>
        <col style="Breite: 100px;"/>
.detail {
    Polsterung unten: 50px;
    Rand oben: 80px;
}

.detail_tabelle {
    table-layout:fixed;/*Die Spaltenbreite wird durch die Tabellenbreite und Spaltenbreite bestimmt. */
    Rand: auto;/*Tabelle zentriert*/
    Textausrichtung: zentriert;
    Rand: 1px durchgezogen #804040;
    Rahmen-Zusammenbruch: Zusammenbruch;
}

.detail_table th {
    Polsterung: 26px;
}

.detail_table td {
    Rand: 1px durchgezogen #804040;
    Polsterung oben: 16px;
    Polsterung unten: 16px;
}

.besonders {
    Textausrichtung: links;
    Polsterung links: 20px;
}

<div Klasse="Detail">

    <Tabelle Klasse="Detailtabelle">

        <Kopf>
        <th colspan="5">Details der ausgewählten Optionen</th>
        </thead>
        <!--Wenn Sie schreiben, folgt es der Breite, die Sie schreiben, aber wenn die Breite, die Sie schreiben, die Tabelle nicht füllt, wird es gemäß dem von Ihnen angegebenen Größenverhältnis gleichmäßig auf alle td aufgeteilt-->
        <!--Jetzt sind die vier Spalten 100 Pixel groß und die Spalte ohne Daten nimmt den gesamten Rest ein-->
        <col style="Breite: 100px;"/>
        <Spalte>
        <col style="Breite: 100px;"/>
        <col style="Breite: 100px;"/>
        <col style="Breite: 100px;"/>

        <tbody>

        <tr>
            <td>
                Seriennummer
            <td>
                Problembeschreibung
            <td>
                Entspricht
            <td>
                Nicht konform</td>
            <td>
                Unsicher
        </tr>

        <?php $i = 1; ?>

        <?php foreach ($test als $item): ?>
            <!--Auswahl abrufen-->
            <?php $temp = $this->session->userdata('b' . $i) ?>

            <tr>

                <td>
                    <?php echo $i; ?>
                </td>

                <td>
                    <?php echo $item; ?>
                </td>

                <td>
                    <?php if ($temp == 1): ?>√<?php endif ?>
                </td>
                <td>
                    <?php if ($temp == 2): ?>√<?php endif ?>
                </td>

                <td>
                    <?php if ($temp == 3): ?>√<?php endif ?>
                </td>

            </tr>

            <?php $i++; ?>

        <?php endforeach; ?>

        </tbody>

    </Tabelle>

</div>

Dies ist das Ende dieses Artikels zur Lösung des Problems ungültiger Tabellenbreiteneinstellungen in HTML. Weitere verwandte Inhalte zu ungültigen Tabellenbreiteneinstellungen finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den verwandten Artikeln weiter unten. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen!

<<:  Lösen Sie das Problem, dass die Methoden der document.getElementBy-Reihe keine Objekte abrufen können

>>:  Zeichnen Sie ein Herz mit CSS3

Artikel empfehlen

Index-Skip-Scan in MySQL 8.0

Vorwort MySQL 8.0.13 unterstützt nun den Index-Sk...

Auszeichnungssprache - Bildersetzung

Klicken Sie hier, um zum Abschnitt „HTML-Tutorial“...

CSS3 erzielt verschiedene Randeffekte

Durchscheinender Rand Ergebnis: Implementierungsc...

Linux implementiert den Quellcode des Zahlenratespiels

Ein einfacher Linux-Ratespiel-Quellcode Spielrege...

Native js realisiert das Ziehen und Ablegen des Neun-Quadrat-Rasters

Verwenden Sie natives JS, um ein neuneckiges Rast...

Drei Möglichkeiten zum Konfigurieren einer JNDI-Datenquelle in Tomcat

In meiner früheren Arbeit war der Entwicklungsser...

Zwei Implementierungen des Front-End-Routings von Vue-Router

Inhaltsverzeichnis Modusparameter HashHistorie Ha...

Tiefgreifendes Verständnis von globalen Sperren und Tabellensperren in MySQL

Vorwort Je nach Umfang der Sperrung können Sperre...

Detaillierte Erklärung der verschiedenen Verwendungen von proxy_pass in nginx

Inhaltsverzeichnis Proxy-Weiterleitungsregeln Der...

So stellen Sie die LNMP-Architektur im Docker bereit

Umweltanforderungen: IP Hostname 192.168.1.1 Knot...

Zusammenfassung zum Sharding von MySQL-Datenbanken und -Tabellen

Während der Projektentwicklung werden unsere Date...