如何在顺风中扩展flexbox到填充
如何在顺风中扩展flexbox到填充
提问于 2021-11-25 12:43:21
如何将flexbox放在所有蓝色背景上
我附上一张它看起来像什么的图片：
这里是使用Tailwind-CSS的代码：
<!-- Tailwind + Fonts -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins">
<link rel=”stylesheet” href=”https://cdn-uicons.flaticon.com/uicons-regular-rounded/css/uicons-regular-rounded.css”>
<script src="https://unpkg.com/feather-icons"></script>
<link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet">
<!-- Body -->
<header class="bg-blue-default flex justify-between p-3.5 text-xs m-0">
<div class="flex justify-between text-white-grayed">
<a class="pl-4 pr-4 hover:text-white-default border-r border-white-default" href="">info@example.eu</a>
<a class="hover:text-white-default" href="">+000 000 000 000</a>
</div>
<div>
</div>
</header>
回答 2
Stack Overflow用户
发布于 2021-11-25 13:00:03
你就快到了。你的页眉已经是一个flexbox了，并且是全宽的。然而，您的第一个孩子(div)只占用它所需的空间。您需要添加w-full，这将使div占用所有可用宽度，并根据整个宽度对齐其内部的项。
<!-- Tailwind + Fonts -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins">
<link rel=”stylesheet” href=”https://cdn-uicons.flaticon.com/uicons-regular-rounded/css/uicons-regular-rounded.css”>
<script src="https://unpkg.com/feather-icons"></script>
<link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet">
<!-- Body -->
<header class="bg-blue-default flex justify-between p-3.5 text-xs m-0">
<div class="w-full flex justify-between items-center text-white-grayed">
<a class="pl-4 pr-4 hover:text-white-default border-r border-white-default" href="">info@example.eu</a>
<a class="hover:text-white-default" href="">+000 000 000 000</a>
</div>
</header>
Stack Overflow用户
发布于 2021-11-25 13:08:37
仅从标头中删除flex类
使用这个
<header class="bg-blue-default justify-between p-3.5 text-xs m-0">而不是
<header class="bg-blue-default flex justify-between p-3.5 text-xs m-0">页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/70111335
复制相关文章
相似问题
腾讯云开发者
