我一直在做一个学习tailwind css的副业项目，我正面临着一个关于flexbox方向响应性的问题。
从我读到的内容来看，你可以通过添加sm: md: lg:来使html标签响应，这样它就会根据屏幕分辨率使用相应的类，但是当我在flexbox上尝试这个方法时，它不起作用。
这是我的一段代码：<div class="flex-col md:flex-row h-screen w-screen m-3">.
正如你所看到的，我想在大于md:的屏幕上使用flex-row，但它一直使用flex-col，即使我超过了md:的分辨率，即768px。
完整代码：https://codesandbox.io/s/pedantic-hoover-lr93g?file=/index.html
这是我删除flex-col而只使用flex时的外观：https://imgur.com/a/tUJKPro
1条答案
按热度按时间fumotvh31#
如果没有“flex”，则无法使用flex-col或flex-row（以及其它flex类）。类“flex”对应于“display：flex”（没有它，div就是块），“flex-row”是“flex-direction：行””，如果没有Flex显示属性，该行将不起作用。
检查文档：https://tailwindcss.com/docs/flex-direction
所以相反
应该是
固定代码：https://codesandbox.io/s/admiring-framework-lxz8y?file=/index.html
还可以根据需要修改较小设备上的宽度。