Wie zentriere ich ein Formular/eine Tabelle mit Feldsätzen in HTML-CSS und halte die Größe konsistent?

Question

In HTML, erstellt mit <form>和<table>. Es sieht so aus:

<form ...>
 <table>
   <tr>
    <td></td>
    <td></td>
   </tr>
   ...
   <tr>
    <td></td>
    <td></td>
   </tr>
 </table>
</form>

Um dieses Formular/diese Tabelle in der Mitte der Seite zu platzieren, können Sie Folgendes verwenden CSS:

table {
   margin: 0px auto;
}

Quelle:

• HTML-Tabelle zentrieren

Bis alles in Ordnung ist.

sollte in Richtung <form>中添加<fieldset>和legend时，实际上是添加到了<table> sein. Daher ist die aktuelle Struktur wie folgt:

<form ...>
<fieldset>
<legend>一些描述...</legend>
 <table>
   <tr>
    <td></td>
    <td></td>
   </tr>
   ...
   <tr>
    <td></td>
    <td></td>
   </tr>
 </table>
</fieldset>
</form>

Hier treten zwei Situationen auf:

1. Wie kann der Rand von <fieldset> auf die gleiche Größe wie das Formular/die Tabelle selbst gebracht werden?

Die Bewerbung läuft wie folgt ab:

fieldset {
     display: inline-block;
}

Quelle:

• Gibt es eine Möglichkeit, den Feldsatz nur so breit zu machen wie die darin enthaltenen Steuerelemente?

Obwohl es wie erwartet funktioniert, <table>ist es immer noch auf der linken Seite.

Frage

• Wie platziere ich ein Formular/eine Tabelle mit einem Feldsatz in der Mitte, während der Feldsatz die gleiche Größe wie das Formular/die Tabelle beibehält?

Answer 1

这样的东西吗？

form {
    display: table;
    margin: 0 auto;
}
table {
   margin: 0 auto;
}
fieldset {
   display: inline-block;
}

<form>
  <fieldset>
    <legend>一些描述...</legend>
    <table>
      <tr>
        <td></td>
        <td></td>
      </tr>
      <tr>
        <td></td>
        <td></td>
      </tr>
    </table>
  </fieldset>
</form>