问题标签 [tailwind-css]

我正在尝试将一个按钮浮动到卡片的右侧。我希望它出现在右下角。

当我使用浮点数时。它出现在父 div 之外，有没有办法正确定位它？

我在这里有一个正在运行的沙箱，里面有代码

https://codesandbox.io/s/tailwind-css-nl0ph

我正在尝试在 Tailwind 或纯 CSS 上制作类似的东西......

所以基本上我们可以在元素之间共享一些类似这样的 css 的背景（我们在每个元素上使用这个类）：

问题是“背景附件：固定”是相对于视口而不是容器元素。所以为了看到完整的色阶，我必须最大化浏览器。

这个或任何与容器相关但与视口无关的背景附件有什么技巧吗？

我正在尝试在带有 webpack 的 5.2 ruby​​ on rails 应用程序上使用 tailwindcss。一切都已设置并且运行良好。除了一个小问题阻止我将应用程序投入生产。

加载页面后，我首先在不到半秒的时间内看到没有 css 的页面，然后应用 css，一切恢复正常。

以下是对该问题的一些捕获： 计划页面加载 登录页面

注意：该应用程序很轻（大约只有 3 页，大视频/图像没什么好看的......）

我不明白为什么。你有什么想法来解决这个问题吗？

感谢您的帮助！

TailwindCSS 看起来像是一个很棒的前端工具，但我想知道如何将它与 Rails Slim 模板语言一起使用？

例如：

如果我通过 HTML2SLIM 运行它，我会得到以下建议：

生成以下 HTML：

似乎冒号 ':' 被作为多个 html 元素进行交互。我想知道是否有办法解决这个问题？我很想将 Slim 与 TailwindCSS 一起使用。

到目前为止，我已经使用 Rails 的 content_tag 取得了一些进展：

但我只能做到这一点。

我经历过.img-wrapper我没有给定高度的父 div，所以这意味着它是自动的，默认情况下它比它的孩子大 7px，img而我期望它会占据孩子的高度。为什么会这样？

的HTML：

CSS：

因为我想要.image-overlay像“img”一样大，所以我必须 bottom: 7px;为它设置才能实现这一目标。

}

这就是我在img：

最后.img-wrapper设置relative为你可以看到顺风。

我的.img-wrapper父 div 里面有不同的 div，因为 div.button-holder从底部向下 50px 并且它也被绝对定位，它导致在父 div 之后覆盖元素，在这种情况下，p元素使父 div 的悬停效果即使悬停在p元素上也处于活动状态。希望你明白我的意思。我怎样才能解决这个问题 ？

的HTML：

以及一些用 SCSS 编写的相关 CSS：

我正在为我的 scss 文件使用 Tailwindcss，它引入了一个新命令 @apply。但问题是 Sublime 突出了这一点（可能是错误或无法识别的语法）。我如何关闭那个单一的突出显示，这样它就不会显示为我所有的@apply 规则的明显错误？

我想知道是否可以将 Tailwindcss 与 Figma 一起使用？如果有人这样做，有什么例子可以看吗？我看到可以从 Figma 中导出颜色并在 taiwind config 中导入它们。但是 Tailwindcss 实用程序呢？此外，它应该适用于 Tailwind v1。此致

我正在尝试file input在头像后面放置一个字段。单击头像时，用户应该能够选择图像。它工作得很好，但我如何隐藏输入字段（请参阅片段）。当我添加visible: hidden它时它消失了，但显然它不再是可点击的了。

我该如何解决这个问题？我正在使用TailwindCss：

谢谢！

我目前正在尝试通过 Webpack 将 Tailwind 安装到 Rails 6 应用程序中，但在遵循文档之后，样式并未应用于视图模板，如图所示。我有 Tailwind v1.0.3。我还尝试将 Webpack 升级到 v4，所以不确定是否是由于这个原因。

我有以下文件：

javascript/css/application.css

我的 packs/application.js 如下所示：

还有我的 /postcss.config.js

我还可以从 packaje.json 文件中看到 Tailwind 实际上已安装。

和 application.html.erb

是repo 中PR 的链接。

知道可能是什么吗？