Question

大家好，

我正在使用HTML / CSS，并使用CSS类

将此表置于页面中心

.tablecenter    { margin-left:auto; margin-right:auto; }

我在桌子后面也有这个按钮：

<input type = "button" value = "Create Listening GIFT" style="???">

但是，正如您在图片中看到的那样，按钮直接在左侧绘制。

我想要什么：我希望从桌子第一列开始的位置绘制我的按钮。此外，因为当我改变浏览器页面大小时，表格的左边距也会改变，我希望按钮“跟随”表并分别改变其左边距。换句话说，无论我如何更改浏览器窗口大小，我都希望我的按钮完全位于表格下方。

我该怎么做？

CODE：

<div>
        <table class = "tablecenter">
            <thead>
                <tr>
                    <th style="height:80px">
                        <span class="tableheader">Listening - Part 1</span>
                    </th>
                    <th style="height:80px">
                        <span class="tableheader">Listening - Part 2</span>
                    </th>
                    <th style="height:80px">
                        <span class="tableheader">Listening - Part 3</span>
                    </th>
                </tr>
            </thead>

            <!-- Listening - Part 1-->
            <tbody>
            <tr>
                <td id = "col1">
                    <label> <span class = "spc7">Speaker A:</span>
                        <select name = "speakerA">
                            <option>Statement 1</option>
                            <option>Statement 2</option>
                            <option>Statement 3</option>
                            <option>Statement 4</option>
                            <option>Statement 5</option>
                            <option>Statement 6</option>
                            <option>Statement 7</option>
                        </select>
                    </label>
                    <p></p>

                    <label> <span class = "spc7">Speaker B:</span>
                        <select name = "speakerB">
                            <option>Statement 1</option>
                            <option>Statement 2</option>
                            <option>Statement 3</option>
                            <option>Statement 4</option>
                            <option>Statement 5</option>
                            <option>Statement 6</option>
                            <option>Statement 7</option>
                        </select>
                    </label>

                    <p></p>
                    <label> <span class = "spc7">Speaker C:</span>
                        <select name = "speakerC">
                            <option>Statement 1</option>
                            <option>Statement 2</option>
                            <option>Statement 3</option>
                            <option>Statement 4</option>
                            <option>Statement 5</option>
                            <option>Statement 6</option>
                            <option>Statement 7</option>
                        </select>
                    </label>

                    <p></p>
                    <label> <span class = "spc7">Speaker D:</span>
                        <select name = "speakerD">
                            <option>Statement 1</option>
                            <option>Statement 2</option>
                            <option>Statement 3</option>
                            <option>Statement 4</option>
                            <option>Statement 5</option>
                            <option>Statement 6</option>
                            <option>Statement 7</option>
                        </select>
                    </label>
                    <p></p>

                    <label> <span class = "spc7">Speaker E:</span>
                        <select name = "speakerE">
                            <option>Statement 1</option>
                            <option>Statement 2</option>
                            <option>Statement 3</option>
                            <option>Statement 4</option>
                            <option>Statement 5</option>
                            <option>Statement 6</option>
                            <option>Statement 7</option>
                        </select>
                    </label>

                    <p></p>
                    <label> <span class = "spc7">Speaker F:</span>
                        <select name = "speakerF">
                            <option>Statement 1</option>
                            <option>Statement 2</option>
                            <option>Statement 3</option>
                            <option>Statement 4</option>
                            <option>Statement 5</option>
                            <option>Statement 6</option>
                            <option>Statement 7</option>
                        </select>
                    </label>
                </td>

                <!-- Listening - Part 2-->
                <td id = "col2">
                    <span class = "spc7"><u>Statement A</u>:</span>
                    <label>1) - True:
                        <input name = "statementA" type = "radio"
                               value = "1) - True" checked>
                    </label>
                    <label>2) - False:
                        <input name = "statementA" type = "radio"
                               value = "2) - False">
                    </label>
                    <label>3) - Not Stated:
                        <input name = "statementA" type = "radio"
                               value = "3) - Not Stated">
                    </label>

                    <p></p>
                    <span class = "spc7"><u>Statement B</u>:</span>
                    <label>1) - True:
                        <input name = "statementB" type = "radio"
                               value = "1) - True" checked>
                    </label>
                    <label>2) - False:
                        <input name = "statementB" type = "radio"
                               value = "2) - False">
                    </label>
                    <label>3) - Not Stated:
                        <input name = "statementB" type = "radio"
                               value = "3) - Not Stated">
                    </label>

                    <p></p>
                    <span class = "spc7"><u>Statement C</u>:</span>
                    <label>1) - True:
                        <input name = "statementC" type = "radio"
                               value = "1) - True" checked>
                    </label>
                    <label>2) - False:
                        <input name = "statementC" type = "radio"
                               value = "2) - False">
                    </label>
                    <label>3) - Not Stated:
                        <input name = "statementC" type = "radio"
                               value = "3) - Not Stated">
                    </label>

                    <p></p>
                    <span class = "spc7"><u>Statement D</u>:</span>
                    <label>1) - True:
                        <input name = "statementD" type = "radio"
                               value = "1) - True" checked>
                    </label>
                    <label>2) - False:
                        <input name = "statementD" type = "radio"
                               value = "2) - False">
                    </label>
                    <label>3) - Not Stated:
                        <input name = "statementD" type = "radio"
                               value = "3) - Not Stated">
                    </label>

                    <p></p>
                    <span class = "spc7"><u>Statement E</u>:</span>
                    <label>1) - True:
                        <input name = "statementE" type = "radio"
                               value = "1) - True" checked>
                    </label>
                    <label>2) - False:
                        <input name = "statementE" type = "radio"
                               value = "2) - False">
                    </label>
                    <label>3) - Not Stated:
                        <input name = "statementE" type = "radio"
                               value = "3) - Not Stated">
                    </label>

                    <p></p>
                    <span class = "spc7"><u>Statement F</u>:</span>
                    <label>1) - True:
                        <input name = "statementF" type = "radio"
                               value = "1) - True" checked>
                    </label>
                    <label>2) - False:
                        <input name = "statementF" type = "radio"
                               value = "2) - False">
                    </label>
                    <label>3) - Not Stated:
                        <input name = "statementF" type = "radio"
                               value = "3) - Not Stated">
                    </label>

                    <p></p>
                    <span class = "spc7"><u>Statement G</u>:</span>
                    <label>1) - True:
                        <input name = "statementG" type = "radio"
                               value = "1) - True" checked>
                    </label>
                    <label>2) - False:
                        <input name = "statementG" type = "radio"
                               value = "2) - False">
                    </label>
                    <label>3) - Not Stated:
                        <input name = "statementG" type = "radio"
                               value = "3) - Not Stated">
                    </label>
                </td>

                <!-- Listening - Part 3-->
                <td id = "col3">
                    <span class = "spc7"><u>Question 3</u>:</span>
                    <label>1)
                        <input name = "question 3" type = "radio"
                               value = "1" checked>
                    </label>
                    <label>2)
                        <input name = "question 3" type = "radio"
                               value = "2">
                    </label>
                    <label>3)
                        <input name = "question 3" type = "radio"
                               value = "3">
                    </label>

                    <p></p>
                    <span class = "spc7"><u>Question 4</u>:</span>
                    <label>1)
                        <input name = "question 4" type = "radio"
                               value = "1" checked>
                    </label>
                    <label>2)
                        <input name = "question 4" type = "radio"
                               value = "2">
                    </label>
                    <label>3)
                        <input name = "question 4" type = "radio"
                               value = "3">
                    </label>

                    <p></p>
                    <span class = "spc7"><u>Question 5</u>:</span>
                    <label>1)
                        <input name = "question 5" type = "radio"
                               value = "1" checked>
                    </label>
                    <label>2)
                        <input name = "question 5" type = "radio"
                               value = "2">
                    </label>
                    <label>3)
                        <input name = "question 5" type = "radio"
                               value = "3">
                    </label>

                    <p></p>
                    <span class = "spc7"><u>Question 6</u>:</span>
                    <label>1)
                        <input name = "question 6" type = "radio"
                               value = "1" checked>
                    </label>
                    <label>2)
                        <input name = "question 6" type = "radio"
                               value = "2">
                    </label>
                    <label>3)
                        <input name = "question 6" type = "radio"
                               value = "3">
                    </label>


                    <p></p>
                    <span class = "spc7"><u>Question 7</u>:</span>
                    <label>1)
                        <input name = "question 7" type = "radio"
                               value = "1" checked>
                    </label>
                    <label>2)
                        <input name = "question 7" type = "radio"
                               value = "2">
                    </label>
                    <label>3)
                        <input name = "question 7" type = "radio"
                               value = "3">
                    </label>


                    <p></p>
                    <span class = "spc7"><u>Question 8</u>:</span>
                    <label>1)
                        <input name = "question 8" type = "radio"
                               value = "1" checked>
                    </label>
                    <label>2)
                        <input name = "question 8" type = "radio"
                               value = "2">
                    </label>
                    <label>3)
                        <input name = "question 8" type = "radio"
                               value = "3">
                    </label>

                    <p></p>
                    <span class = "spc7"><u>Question 9</u>:</span>
                    <label>1)
                        <input name = "question 9" type = "radio"
                               value = "1" checked>
                    </label>
                    <label>2)
                        <input name = "question 9" type = "radio"
                               value = "2">
                    </label>
                    <label>3)
                        <input name = "question 9" type = "radio"
                               value = "3">
                    </label>
                </td>
            </tr>
            </tbody>
        </table>
        <br>
            <input type = "button" value = "Create Listening GIFT">
        </div>

Answer 1

只需删除margin-left：auto;保证金右：自动;从表中统治。在父div上应用这些css样式以及display：table。

div {
      margin: auto;
      display: table;
    }

这将确保按钮始终保持在

的第一列的开头

Answer 2

用div包装你的代码并将其宽度设置为880px，因为我们已经知道表的宽度，并且设置为margin-left和right as auto

div{
    margin-left:auto;
  margin-right:auto;
  width:900px;
}
table{
  
}

    <div>
      <table class="tablecenter">
        <thead>
          <tr>
            <th style="height:80px">
              <span class="tableheader">Listening - Part 1</span>
            </th>
            <th style="height:80px">
              <span class="tableheader">Listening - Part 2</span>
            </th>
            <th style="height:80px">
              <span class="tableheader">Listening - Part 3</span>
            </th>
          </tr>
        </thead>

        <!-- Listening - Part 1-->
        <tbody>
          <tr>
            <td id="col1">
              <label> <span class="spc7">Speaker A:</span>
                <select name="speakerA">
                  <option>Statement 1</option>
                  <option>Statement 2</option>
                  <option>Statement 3</option>
                  <option>Statement 4</option>
                  <option>Statement 5</option>
                  <option>Statement 6</option>
                  <option>Statement 7</option>
                </select>
              </label>
              <p></p>

              <label> <span class="spc7">Speaker B:</span>
                <select name="speakerB">
                  <option>Statement 1</option>
                  <option>Statement 2</option>
                  <option>Statement 3</option>
                  <option>Statement 4</option>
                  <option>Statement 5</option>
                  <option>Statement 6</option>
                  <option>Statement 7</option>
                </select>
              </label>

              <p></p>
              <label> <span class="spc7">Speaker C:</span>
                <select name="speakerC">
                  <option>Statement 1</option>
                  <option>Statement 2</option>
                  <option>Statement 3</option>
                  <option>Statement 4</option>
                  <option>Statement 5</option>
                  <option>Statement 6</option>
                  <option>Statement 7</option>
                </select>
              </label>

              <p></p>
              <label> <span class="spc7">Speaker D:</span>
                <select name="speakerD">
                  <option>Statement 1</option>
                  <option>Statement 2</option>
                  <option>Statement 3</option>
                  <option>Statement 4</option>
                  <option>Statement 5</option>
                  <option>Statement 6</option>
                  <option>Statement 7</option>
                </select>
              </label>
              <p></p>

              <label> <span class="spc7">Speaker E:</span>
                <select name="speakerE">
                  <option>Statement 1</option>
                  <option>Statement 2</option>
                  <option>Statement 3</option>
                  <option>Statement 4</option>
                  <option>Statement 5</option>
                  <option>Statement 6</option>
                  <option>Statement 7</option>
                </select>
              </label>

              <p></p>
              <label> <span class="spc7">Speaker F:</span>
                <select name="speakerF">
                  <option>Statement 1</option>
                  <option>Statement 2</option>
                  <option>Statement 3</option>
                  <option>Statement 4</option>
                  <option>Statement 5</option>
                  <option>Statement 6</option>
                  <option>Statement 7</option>
                </select>
              </label>
            </td>

            <!-- Listening - Part 2-->
            <td id="col2">
              <span class="spc7"><u>Statement A</u>:</span>
              <label>1) - True:
                <input name="statementA" type="radio" value="1) - True" checked>
              </label>
              <label>2) - False:
                <input name="statementA" type="radio" value="2) - False">
              </label>
              <label>3) - Not Stated:
                <input name="statementA" type="radio" value="3) - Not Stated">
              </label>

              <p></p>
              <span class="spc7"><u>Statement B</u>:</span>
              <label>1) - True:
                <input name="statementB" type="radio" value="1) - True" checked>
              </label>
              <label>2) - False:
                <input name="statementB" type="radio" value="2) - False">
              </label>
              <label>3) - Not Stated:
                <input name="statementB" type="radio" value="3) - Not Stated">
              </label>

              <p></p>
              <span class="spc7"><u>Statement C</u>:</span>
              <label>1) - True:
                <input name="statementC" type="radio" value="1) - True" checked>
              </label>
              <label>2) - False:
                <input name="statementC" type="radio" value="2) - False">
              </label>
              <label>3) - Not Stated:
                <input name="statementC" type="radio" value="3) - Not Stated">
              </label>

              <p></p>
              <span class="spc7"><u>Statement D</u>:</span>
              <label>1) - True:
                <input name="statementD" type="radio" value="1) - True" checked>
              </label>
              <label>2) - False:
                <input name="statementD" type="radio" value="2) - False">
              </label>
              <label>3) - Not Stated:
                <input name="statementD" type="radio" value="3) - Not Stated">
              </label>

              <p></p>
              <span class="spc7"><u>Statement E</u>:</span>
              <label>1) - True:
                <input name="statementE" type="radio" value="1) - True" checked>
              </label>
              <label>2) - False:
                <input name="statementE" type="radio" value="2) - False">
              </label>
              <label>3) - Not Stated:
                <input name="statementE" type="radio" value="3) - Not Stated">
              </label>

              <p></p>
              <span class="spc7"><u>Statement F</u>:</span>
              <label>1) - True:
                <input name="statementF" type="radio" value="1) - True" checked>
              </label>
              <label>2) - False:
                <input name="statementF" type="radio" value="2) - False">
              </label>
              <label>3) - Not Stated:
                <input name="statementF" type="radio" value="3) - Not Stated">
              </label>

              <p></p>
              <span class="spc7"><u>Statement G</u>:</span>
              <label>1) - True:
                <input name="statementG" type="radio" value="1) - True" checked>
              </label>
              <label>2) - False:
                <input name="statementG" type="radio" value="2) - False">
              </label>
              <label>3) - Not Stated:
                <input name="statementG" type="radio" value="3) - Not Stated">
              </label>
            </td>

            <!-- Listening - Part 3-->
            <td id="col3">
              <span class="spc7"><u>Question 3</u>:</span>
              <label>1)
                <input name="question 3" type="radio" value="1" checked>
              </label>
              <label>2)
                <input name="question 3" type="radio" value="2">
              </label>
              <label>3)
                <input name="question 3" type="radio" value="3">
              </label>

              <p></p>
              <span class="spc7"><u>Question 4</u>:</span>
              <label>1)
                <input name="question 4" type="radio" value="1" checked>
              </label>
              <label>2)
                <input name="question 4" type="radio" value="2">
              </label>
              <label>3)
                <input name="question 4" type="radio" value="3">
              </label>

              <p></p>
              <span class="spc7"><u>Question 5</u>:</span>
              <label>1)
                <input name="question 5" type="radio" value="1" checked>
              </label>
              <label>2)
                <input name="question 5" type="radio" value="2">
              </label>
              <label>3)
                <input name="question 5" type="radio" value="3">
              </label>

              <p></p>
              <span class="spc7"><u>Question 6</u>:</span>
              <label>1)
                <input name="question 6" type="radio" value="1" checked>
              </label>
              <label>2)
                <input name="question 6" type="radio" value="2">
              </label>
              <label>3)
                <input name="question 6" type="radio" value="3">
              </label>


              <p></p>
              <span class="spc7"><u>Question 7</u>:</span>
              <label>1)
                <input name="question 7" type="radio" value="1" checked>
              </label>
              <label>2)
                <input name="question 7" type="radio" value="2">
              </label>
              <label>3)
                <input name="question 7" type="radio" value="3">
              </label>


              <p></p>
              <span class="spc7"><u>Question 8</u>:</span>
              <label>1)
                <input name="question 8" type="radio" value="1" checked>
              </label>
              <label>2)
                <input name="question 8" type="radio" value="2">
              </label>
              <label>3)
                <input name="question 8" type="radio" value="3">
              </label>

              <p></p>
              <span class="spc7"><u>Question 9</u>:</span>
              <label>1)
                <input name="question 9" type="radio" value="1" checked>
              </label>
              <label>2)
                <input name="question 9" type="radio" value="2">
              </label>
              <label>3)
                <input name="question 9" type="radio" value="3">
              </label>
            </td>
          </tr>
        </tbody>
      </table>
      <br>
      <input type="button" value="Create Listening GIFT">
    </div>

或

将其样式设置为display：flex并将方向设置为column，然后将content-content设置为center

检查此代码段

div {
  display: flex;
  flex-direction: column;
  align-items: center;
}
input[ type="button"] {
  flex: 0 1;
}

<div>
  <table class="tablecenter">
    <thead>
      <tr>
        <th style="height:80px">
          <span class="tableheader">Listening - Part 1</span>
        </th>
        <th style="height:80px">
          <span class="tableheader">Listening - Part 2</span>
        </th>
        <th style="height:80px">
          <span class="tableheader">Listening - Part 3</span>
        </th>
      </tr>
    </thead>

    <!-- Listening - Part 1-->
    <tbody>
      <tr>
        <td id="col1">
          <label> <span class="spc7">Speaker A:</span>
            <select name="speakerA">
              <option>Statement 1</option>
              <option>Statement 2</option>
              <option>Statement 3</option>
              <option>Statement 4</option>
              <option>Statement 5</option>
              <option>Statement 6</option>
              <option>Statement 7</option>
            </select>
          </label>
          <p></p>

          <label> <span class="spc7">Speaker B:</span>
            <select name="speakerB">
              <option>Statement 1</option>
              <option>Statement 2</option>
              <option>Statement 3</option>
              <option>Statement 4</option>
              <option>Statement 5</option>
              <option>Statement 6</option>
              <option>Statement 7</option>
            </select>
          </label>

          <p></p>
          <label> <span class="spc7">Speaker C:</span>
            <select name="speakerC">
              <option>Statement 1</option>
              <option>Statement 2</option>
              <option>Statement 3</option>
              <option>Statement 4</option>
              <option>Statement 5</option>
              <option>Statement 6</option>
              <option>Statement 7</option>
            </select>
          </label>

          <p></p>
          <label> <span class="spc7">Speaker D:</span>
            <select name="speakerD">
              <option>Statement 1</option>
              <option>Statement 2</option>
              <option>Statement 3</option>
              <option>Statement 4</option>
              <option>Statement 5</option>
              <option>Statement 6</option>
              <option>Statement 7</option>
            </select>
          </label>
          <p></p>

          <label> <span class="spc7">Speaker E:</span>
            <select name="speakerE">
              <option>Statement 1</option>
              <option>Statement 2</option>
              <option>Statement 3</option>
              <option>Statement 4</option>
              <option>Statement 5</option>
              <option>Statement 6</option>
              <option>Statement 7</option>
            </select>
          </label>

          <p></p>
          <label> <span class="spc7">Speaker F:</span>
            <select name="speakerF">
              <option>Statement 1</option>
              <option>Statement 2</option>
              <option>Statement 3</option>
              <option>Statement 4</option>
              <option>Statement 5</option>
              <option>Statement 6</option>
              <option>Statement 7</option>
            </select>
          </label>
        </td>

        <!-- Listening - Part 2-->
        <td id="col2">
          <span class="spc7"><u>Statement A</u>:</span>
          <label>1) - True:
            <input name="statementA" type="radio" value="1) - True" checked>
          </label>
          <label>2) - False:
            <input name="statementA" type="radio" value="2) - False">
          </label>
          <label>3) - Not Stated:
            <input name="statementA" type="radio" value="3) - Not Stated">
          </label>

          <p></p>
          <span class="spc7"><u>Statement B</u>:</span>
          <label>1) - True:
            <input name="statementB" type="radio" value="1) - True" checked>
          </label>
          <label>2) - False:
            <input name="statementB" type="radio" value="2) - False">
          </label>
          <label>3) - Not Stated:
            <input name="statementB" type="radio" value="3) - Not Stated">
          </label>

          <p></p>
          <span class="spc7"><u>Statement C</u>:</span>
          <label>1) - True:
            <input name="statementC" type="radio" value="1) - True" checked>
          </label>
          <label>2) - False:
            <input name="statementC" type="radio" value="2) - False">
          </label>
          <label>3) - Not Stated:
            <input name="statementC" type="radio" value="3) - Not Stated">
          </label>

          <p></p>
          <span class="spc7"><u>Statement D</u>:</span>
          <label>1) - True:
            <input name="statementD" type="radio" value="1) - True" checked>
          </label>
          <label>2) - False:
            <input name="statementD" type="radio" value="2) - False">
          </label>
          <label>3) - Not Stated:
            <input name="statementD" type="radio" value="3) - Not Stated">
          </label>

          <p></p>
          <span class="spc7"><u>Statement E</u>:</span>
          <label>1) - True:
            <input name="statementE" type="radio" value="1) - True" checked>
          </label>
          <label>2) - False:
            <input name="statementE" type="radio" value="2) - False">
          </label>
          <label>3) - Not Stated:
            <input name="statementE" type="radio" value="3) - Not Stated">
          </label>

          <p></p>
          <span class="spc7"><u>Statement F</u>:</span>
          <label>1) - True:
            <input name="statementF" type="radio" value="1) - True" checked>
          </label>
          <label>2) - False:
            <input name="statementF" type="radio" value="2) - False">
          </label>
          <label>3) - Not Stated:
            <input name="statementF" type="radio" value="3) - Not Stated">
          </label>

          <p></p>
          <span class="spc7"><u>Statement G</u>:</span>
          <label>1) - True:
            <input name="statementG" type="radio" value="1) - True" checked>
          </label>
          <label>2) - False:
            <input name="statementG" type="radio" value="2) - False">
          </label>
          <label>3) - Not Stated:
            <input name="statementG" type="radio" value="3) - Not Stated">
          </label>
        </td>

        <!-- Listening - Part 3-->
        <td id="col3">
          <span class="spc7"><u>Question 3</u>:</span>
          <label>1)
            <input name="question 3" type="radio" value="1" checked>
          </label>
          <label>2)
            <input name="question 3" type="radio" value="2">
          </label>
          <label>3)
            <input name="question 3" type="radio" value="3">
          </label>

          <p></p>
          <span class="spc7"><u>Question 4</u>:</span>
          <label>1)
            <input name="question 4" type="radio" value="1" checked>
          </label>
          <label>2)
            <input name="question 4" type="radio" value="2">
          </label>
          <label>3)
            <input name="question 4" type="radio" value="3">
          </label>

          <p></p>
          <span class="spc7"><u>Question 5</u>:</span>
          <label>1)
            <input name="question 5" type="radio" value="1" checked>
          </label>
          <label>2)
            <input name="question 5" type="radio" value="2">
          </label>
          <label>3)
            <input name="question 5" type="radio" value="3">
          </label>

          <p></p>
          <span class="spc7"><u>Question 6</u>:</span>
          <label>1)
            <input name="question 6" type="radio" value="1" checked>
          </label>
          <label>2)
            <input name="question 6" type="radio" value="2">
          </label>
          <label>3)
            <input name="question 6" type="radio" value="3">
          </label>


          <p></p>
          <span class="spc7"><u>Question 7</u>:</span>
          <label>1)
            <input name="question 7" type="radio" value="1" checked>
          </label>
          <label>2)
            <input name="question 7" type="radio" value="2">
          </label>
          <label>3)
            <input name="question 7" type="radio" value="3">
          </label>


          <p></p>
          <span class="spc7"><u>Question 8</u>:</span>
          <label>1)
            <input name="question 8" type="radio" value="1" checked>
          </label>
          <label>2)
            <input name="question 8" type="radio" value="2">
          </label>
          <label>3)
            <input name="question 8" type="radio" value="3">
          </label>

          <p></p>
          <span class="spc7"><u>Question 9</u>:</span>
          <label>1)
            <input name="question 9" type="radio" value="1" checked>
          </label>
          <label>2)
            <input name="question 9" type="radio" value="2">
          </label>
          <label>3)
            <input name="question 9" type="radio" value="3">
          </label>
        </td>
      </tr>
    </tbody>
  </table>
  <br>
  <input type="button" value="Create Listening GIFT">
</div>
html css

希望这有帮助

Answer 3

尝试将宽度百分比（98％）添加到类.tablecenter中，如下所示

.tablecenter    { margin-left:auto; margin-right:auto;width:98% }

并使用具有相同类的div来扭曲按钮，或添加具有与上述相同属性的新类

<div class="tablecenter">
    <input type = "button" value = "Create Listening GIFT">
</div>

Answer 4

我采取了略微不同的方法。我的css

    .tablecenter {
        margin-left: auto;
        margin-right: auto;

        border-bottom:none;
    }
   tbody td, thead th {
        border:solid black thin
    }

和桌子的底部......

        </tbody>
        <tfoot>
            <tr>
                <td colspan="3"><input type="button" value="Create Listening GIFT"></td>
            </tr>
        </tfoot>
    </table>

如何使按钮的左边距始终等于左边距？

4 个答案: