css - Accordion 中的表格落后于以下 Accordion 选项卡

Question

我希望手风琴中的桌子将下面的手风琴标签向下推。这与页面上其他包含表格的手风琴选项卡一起使用。

我正在使用 Foundation 5 Library，但我正在使用 vanilla CSS 来创建手风琴。

问题图片，表落后于手风琴下方

<div class="accordion text-center"> <strong>Performance Table</strong></div>
                        <div class="panel-accord">
                            <div class="row">
                                <div class="padding">
                                    <div class="small-12 large-12 columns">
                                        <p><strong>240V Connection</strong> - Link Position A</p>
                                        <div style="overflow-x:auto;">
                                            <table style="width: 100%;">
                                                <tr>
                                                    <th>Channel</th>

---

/* Style the buttons that are used to open and close the accordion panel */
div.accordion {
  background-color: #eee;
  color: #444;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  text-align: left;
  border: none;
  outline: none;
  transition: 0.4s;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
div.accordion.active, div.accordion:hover {
  background-color: #ddd;
}

/* Style the accordion panel. Note: hidden by default */
div.panel-accord {
  padding: 0 18px;
  background-color: white;
  max-height: 0;
  overflow: hidden;
  transition: 0.6s ease-in-out;
  opacity: 0;
}

div.panel-accord.show {
  opacity: 1;
  max-height: 1500px; /* Whatever you like, as long as its more than the height of the content (on all screen sizes) */
  padding-top: 17px;
}

/* Style the buttons that are used to open and close the accordion panel */
div.accordion-internal {
  background-color: #eee;
  color: #444;
  cursor: pointer;
  padding: 5px;
  width: 100%;
  text-align: left;
  border: none;
  outline: none;
  transition: 0.4s;
  margin-bottom: 5px;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
div.accordion-internal.active, div.accordion:hover {
  background-color: #ddd;
}

---

标签： csshtml-tableaccordion