position error from menu/dropdown in table Scrolling stuck #2583
Unanswered
allweDepth
asked this question in
Collections (form, grid, menu, message, table, ...)
Replies: 3 comments 1 reply
-
Please provide a jsfiddle with your example code, so we can investigate. The dropdown popup might needs a different context setting (we recently fixed that in the beta). But without a testcase we cannot tell. Thanks |
Beta Was this translation helpful? Give feedback.
0 replies
-
<table class="ui first last head foot stuck unstackable celled table">
<thead>
<tr>
<th class="one wide">Kode</th>
<th>Uraian</th>
<th>Satuan</th>
<th class="two wide">Harga Satuan</th>
<th>Sumber Data</th>
<th>Keterangan</th>
<th class="one wide">Aksi</th>
</tr>
</thead>
<tbody>
<tr>
<td>M01</td>
<td>Bos</td>
<td>Jam</td>
<td>100.000.000</td>
<td>SBU</td>
<td>Satuan Jam</td>
<td>
<div class="ui teal buttons mini">
<div class="ui button">Save</div>
<div class="ui floating dropdown icon button lain">
<i class="dropdown icon"></i>
<div class="menu">
<div class="item"><i class="edit icon"></i> Edit Post</div>
<div class="item"><i class="delete icon"></i> Remove Post</div>
<div class="item"><i class="hide icon"></i> Hide Post</div>
</div>
</div>
</div>
</td>
</tr>
<tr>
<td>M01</td>
<td>Mandor</td>
<td>Jam</td>
<td>100.000.000</td>
<td>SBU</td>
<td>Satuan Jam</td>
<td>
<div class="ui icon mini dropdown button custom">
<i class="th icon"></i>
<div class="left menu">
<div class="ui error message p-0">
<div class="ui mini icon buttons">
<div class="ui blue button">
<i class="align left icon"></i>
</div>
<div class="ui red button">
<i class="align center icon"></i>
</div>
<div class="ui yellow button">
<i class="align right icon"></i>
</div>
<div class="ui secondary button">
<i class="align justify icon"></i>
</div>
</div>
</div>
</div>
</div>
</td>
</tr>
<tr>
<td>M01</td>
<td>Tukang</td>
<td>Jam</td>
<td>100.000.000</td>
<td>SBU</td>
<td>Satuan Jam</td>
<td>
<div class="ui icon mini dropdown button custom">
<i class="th icon"></i>
<div class="left menu">
<div class="ui error message p-0">
<div class="ui mini icon buttons">
<div class="ui blue button">
<i class="align left icon"></i>
</div>
<div class="ui red button">
<i class="align center icon"></i>
</div>
<div class="ui yellow button">
<i class="align right icon"></i>
</div>
<div class="ui secondary button">
<i class="align justify icon"></i>
</div>
</div>
</div>
</div>
</div>
</td>
</tr>
<tr>
<td>M01</td>
<td>Tukang</td>
<td>Jam</td>
<td>100.000.000</td>
<td>SBU</td>
<td>Satuan Jam</td>
<td>
<div class="ui icon mini dropdown button custom">
<i class="th icon"></i>
<div class="left menu">
<div class="ui error message p-0">
<div class="ui mini icon buttons">
<div class="ui blue button">
<i class="align left icon"></i>
</div>
<div class="ui red button">
<i class="align center icon"></i>
</div>
<div class="ui yellow button">
<i class="align right icon"></i>
</div>
<div class="ui secondary button">
<i class="align justify icon"></i>
</div>
</div>
</div>
</div>
</div>
</td>
</tr>
<tr>
<td>M02</td>
<td>Hore</td>
<td>Jam</td>
<td>100.000.000</td>
<td>SBU</td>
<td>Satuan Jam</td>
<td>
<div class="ui icon mini dropdown button custom">
<i class="th icon"></i>
<div class="left menu">
<div class="ui error message p-0">
<div class="ui mini icon buttons">
<div class="ui blue button">
<i class="align left icon"></i>
</div>
<div class="ui red button">
<i class="align center icon"></i>
</div>
<div class="ui yellow button">
<i class="align right icon"></i>
</div>
<div class="ui secondary button">
<i class="align justify icon"></i>
</div>
</div>
</div>
</div>
</div>
</td>
</tr>
<tr>
<td>M01</td>
<td>Tukang</td>
<td>Jam</td>
<td>100.000.000</td>
<td>SBU</td>
<td>Satuan Jam</td>
<td>
<div class="ui icon mini dropdown button custom">
<i class="th icon"></i>
<div class="left menu">
<div class="ui error message p-0">
<div class="ui mini icon buttons">
<div class="ui blue button">
<i class="align left icon"></i>
</div>
<div class="ui red button">
<i class="align center icon"></i>
</div>
<div class="ui yellow button">
<i class="align right icon"></i>
</div>
<div class="ui secondary button">
<i class="align justify icon"></i>
</div>
</div>
</div>
</div>
</div>
</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>Names:6</td>
<td>av.25</td>
<td>Jobs : 2</td>
<td>Jobs : 2</td>
<td>Jobs : 2</td>
<td>Jobs : 2</td>
<td>Jobs : 2</td>
</tr>
<tr>
<th colspan="7">
<div class="ui right floated pagination menu">
<a class="icon item">
<i class="left chevron icon"></i>
</a>
<a class="item">1</a>
<a class="item">2</a>
<a class="item">3</a>
<a class="item">4</a>
<a class="icon item">
<i class="right chevron icon"></i>
</a>
</div>
</th>
</tr>
</tfoot>
</table> |
Beta Was this translation helpful? Give feedback.
1 reply
-
I put your code into a jsfiddle: Will need to investigate, as position:sticky seems to block any z-index which the dropdown menu would need |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
how fix menu position top stuck table?
Beta Was this translation helpful? Give feedback.
All reactions