我使用语义UI和具有网格建立一个标签段内,如下所示:媒体查询 - 改变CSS动态内容宽度改变
<div class="ui bottom attached tab segment" data-tab="Overall Stats">
<div class="ui internally celled stackable grid">
<div class="row">
<div class="eight wide column">
<h4 class="ui blue header">Top Goal Scorers
<div class="sub header">(All Age Groups)</div>
</h4>
<div id="showOverallGB"></div>
</div>
<div class="eight wide column">
<h4 class="ui blue header">Most MoM Awards
<div class="sub header">(All Age Groups)</div>
</h4>
<div id="showOverallMoM"></div>
</div>
</div>
</div>
在showOverall*
的div我添加动态创建的表。我遇到的问题是,创建的表格可能比它们所在的列宽,这意味着左手表与右手表重叠(在非移动设备上查看时,网格不会堆叠)。如果动态添加的表格比它们所在的列更宽,是否有办法调用网格的stackable
部分?
编辑:这里有一个小提琴 - https://jsfiddle.net/eynnqLkk/1/ 你需要去Age Group Stats
选项卡,然后玩的的jsfiddle边界。你应该看到:
分享一把小提琴。 –
@ Geoman-Yabes-你确定吗?我检查了它,没有看到任何缺失的标签。另外,表格应该在大屏幕上水平对齐。但问题是:在某些屏幕尺寸上,表格重叠,因为屏幕不够宽,但屏幕足够宽以防止媒体查询使网格可堆叠。 – SimpleOne
对不起。删除我的评论 –