问题标签 [grid-system]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
css - 用于响应式网格系统的 Flexbox 增长和收缩属性列与确定的宽度列
最近我一直在学习 flexbox 以及如何制作自己的网格系统。当使用浮动制作网格系统时,我们确定每个布局的列数和每列的百分比宽度。但是在使用 flexbox 的时候,我看到的所有布局教程都只是简单的使用flex-direction: row;
andflex: 1
列,让它们都大小相等,间距相等,居中并在一行中。但是当我在 github 上查看 flexboxgrid 源代码时,它们使用的原理与 bootstrap 3 相同。它们具有不同屏幕尺寸的列,12 列和flex-grow
,shrink
被禁用。相反,每列都以宽度百分比确定,例如col-xs-1
max-width: 8.33%
.
现在我想知道这两种技术有什么区别,哪一种更可取。我的意思是确定每列的宽度需要大量计算,而使用 flex grow 属性只是用相同大小的列和排水沟来满足主轴上的整个视口。
reactjs - 使用 Material-UI 实现网格系统的最简单方法
我已经被 React 应用程序周围的整个生态系统所淹没,我想采取最简单(和体面)的方式来使用带有 Material-UI 的网格系统。
它是哪一个以及如何用几句话来使用它?
(我读了很多关于这个话题但仍然不确定,这就是我问这个确切问题的原因)
谢谢!
html - 孩子不留在父 div 内
小提琴:https ://jsfiddle.net/uatzust3/
这是我的问题的小提琴,你会观察到孩子们没有留在父 div 内card
,而且我希望div
s 占据他们没有占据的父母的全宽。
另外,我应该在哪里学习最佳实践?我是社区的新手。提前致谢。
左边的 div(black_container)
内容少,但要一直按照右边的 div 的宽度排列高度,(content_container)
同时留在card
div 里面。
html - 表格在一栏,文本段落在另一栏
我怎样才能在容器的一侧有一个表格,而在另一侧有一个文本段落?我想如果我把它全部放在一个有一行两列的容器中,它会起作用,但由于某种原因,段落文本显示在左侧的表单下方。
这是根据我现在拥有的代码所发生的事情的屏幕截图。
我刚开始学习编码,所以如果这看起来是一个愚蠢的问题,我深表歉意。我四处寻找,在任何地方都找不到答案。
先感谢您!
css - 如何使用引导程序对齐 div 和行
我无法对齐嵌套行。见下图。我在 md 和 lg 屏幕上有 1 行为 9,3 行为 3。9+3=12。在 sm 屏幕中,我希望第一行为 12,其他 3 行位于其下(4+4+4)。
html - xs屏幕中的引导网格系统2项
我有以下网格系统,它们是 3 行,每行在大屏幕中有 3 个项目,我想编辑代码,使它们成为 xs 屏幕每列中的 2 个项目,但它们被遗漏了,如何我可以这样做吗?
twitter-bootstrap - Bootstrap 3.3.7 - 网格系统在 Safari 10 上不起作用?
从这里的文档中说,它支持 IOS 和 Mac 桌面上的 Safari。
但为什么这是我在我的 Safari 上得到的呢?
这是我的代码:
我环顾四周,但还没有找到任何修复方法。有任何想法吗?
如果我将它升级到第 4 版,那就更糟糕了——它在 Chrome 上崩溃得可怕!
Foundation呢?它对所有浏览器都有更好的网格系统支持吗?
请注意,您必须在整页上运行我的代码才能在 Chrome、Opera 和 Firefox 上看到正确的网格布局。