flexbox 相关问题

CSS3模块提供灵活的布局,提供了广泛的对齐元素选项,同时无需浮动和表格。

使用 flex 在 CSS 网格项内定位图像、文本和链接

我正在创建一个 html/css 布局,它需要如下所示: (https://i.sstatic.net/Z49ekM8m.png) 每个框都是一个链接。将活动链接区域扩展到整个框,并获取文本位置...

回答 1 投票 0

为什么我的 SlickJS 轮播从我的页面上消失了?

我想使用 slick.js 来轮播我的评论(不需要 slick 的样式,所以我不将其包含在 html 标题中)。当我尝试时,评论容器消失了。如何修复它?我在做什么...

回答 1 投票 0

slick.js 轮播消失了我的容器,如何修复它?

我想使用 slick.js 来轮播我的评论(不需要 slick 的样式,所以我不将其包含在 html 标题中。 当我尝试时,评论容器消失了。 如何修复它?我在做什么

回答 1 投票 0

栏目从上到下、从左到右以及自动宽度调整

我有这个代码: .flex #left { 最小高度:230px; } #文件{ 显示:柔性; 弹性包裹:包裹; 列表样式:无; 保证金:0; 内边距:10px; 位置:相对; 用户选择:无;

回答 1 投票 0

列从上到下、从左到右以及自动宽度调整

我有这个结构 .flex #left { 最小高度:230px; } #文件{ 显示:柔性; 弹性包裹:包裹; 列表样式:无; 保证金:0; 内边距:10px; 位置:相对; 用户选择:n...

回答 1 投票 0

如何在图形上放置文本以及相对于其容器在弹性盒内定位和调整盒子的大小?

我正在创建一个简单的小“旗帜大厅”HTML 页面,该页面应该有一个显示为 png 图像的狭窄旗帜列,每个标志都位于 CSS 图片框架内。这里的 CSS 框架示例是我的

回答 1 投票 0

获取图形来填充父容器的高度

我正在使用 Flexbox 创建 Dash 布局。它们非常有用。但是,我在调整图表大小以填充与破折号卡相同的空间时遇到问题,因为我不知道...的默认大小...

回答 1 投票 0

尽管内容有所不同,但为什么所有卡片的高度都相同?

我正在使用 Tailwind CSS 在 React 应用程序中创建评论部分,我希望每个评论卡根据其包含的文本量调整其高度。然而,尽管使用了fle...

回答 1 投票 0

如何让两个内部div垂直生长在一起,而外部div处理垂直溢出?

我有一个外部 div,它具有最大高度和溢出 y:auto。 它里面有两个并排的 div,由于其中一个的内容而可能是垂直的。 左边的div有一个灰色的背景...

回答 1 投票 0

如何在 Flex 元素内使用省略号

首先有一个固定大小的div(青色)。里面有两个div。一种是弹性的(粉色),另一种是固定尺寸的(灰色)。两个具有长文本的元素位于 flex 元素中。如果文字很长,我想要粉色和灰色......

回答 1 投票 0

Dash:获取图形以填充父容器的高度

我正在使用 Flexbox 创建 Dash 布局。它们非常有用。但是,我在调整图表大小以填充与破折号卡相同的空间时遇到问题,因为我不知道...的默认大小...

回答 1 投票 0

通过 Tailwind 在桌面和移动设备上切换 Flexbox 容器

我想更改屏幕大小调整时三个组件的显示和顺序。我已经尝试过使用 Flexbox 进行一些操作,但我不确定这是否可行。 本质上我想要移动设备上的组件到应用程序......

回答 1 投票 0

防止第一个 Flexbox 子项影响第二个 Flexbox 子项的高度

目前,我正在开发一个项目,该项目似乎需要在 HTML/CSS 端使用大量嵌套的 Flexbox。到目前为止,我已经使用了一个 Flexbox 父级和一组嵌套的 Flexbox 子级......

回答 1 投票 0

防止第一个 Flexbox 子项影响第二个 Flexbox 子项的高度

目前,我正在开发一个项目,该项目似乎需要在 HTML/CSS 端使用大量嵌套的 Flexbox。到目前为止,我已经使用了一个 Flexbox 父级和一组嵌套的 Flexbox 子级......

回答 1 投票 0

调整 Flexbox 中的元素无法正常工作

我正在尝试调整 Flexbox 容器内的过滤器下拉列表。但由于某种原因,第一行的前两列总是会移动。这让我发疯。我也尝试过使用间隙

回答 1 投票 0

侧边栏使水平滚动条出现在屏幕底部

第一个子 div 是侧边栏,第二个子 div 是表格: 第一个子 div 是侧边栏,第二个子 div 是表格: <div class="flex w-full flex-col items-start justify-start gap-6 md:flex-row"> <div class="flex w-full flex-col items-start justify-start gap-2 md:w-auto"> <!-- Sidebar (md:max-w-64) --> </div> </div> <div class="flex w-full flex-col items-start justify-start gap-6"> <!-- Table --> </div> </div> 侧边栏导致布局在底部有第二个水平滚动条: 我知道这是侧边栏,因为如果我删除侧边栏,第二个滚动条就会消失: https://play.tailwindcss.com/AU3667Sv4d 这里有什么问题以及如何解决它? <div class="flex w-full flex-col items-start justify-start gap-6 md:flex-row"> <div class="flex w-full flex-col items-start justify-start gap-2 md:w-auto"> <!-- Sidebar (md:max-w-64) --> </div> </div> <!-- just remove lefbar width from full viewport width as below till md breakpoint --> <div class="flex w-full md:w-[calc(100vw_-_200px)] flex-col items-start justify-start gap-6"> <!-- Table --> </div> 工作示例

回答 1 投票 0

CSS Flex-Box:.map 结果超出 div 容器

我无法“调整”使用 .map 函数映射的 API 查询结果以适合 div 容器。我正在使用反应。 这是我的CSS: .book-结果-容器 { 最大高度...

回答 1 投票 0

调整窗口大小时,容器内具有相对定位的绝对元素不会移动

我是html/css新手,根据我的理解,在调整窗口大小等时,位于相对位置的容器内部的绝对定位元素应该随之移动,但它不起作用...

回答 1 投票 0

如何使用flexbox在单行和多行格式之间响应式切换时重新排列元素?

我有一组表单输入,它们在较大视口上显示在单行上,并在较小视口上折叠为多行显示。在单行显示上我想要一个取消按钮...

回答 1 投票 0

组件未正确调整宽度属性

我正在努力尝试在 Angular 中设置组件的宽度。我正在使用flex,也许grid会帮助我,但我想使用flexbox来学习。为了简化起见,我有一个带有 div 的页面,其中包含...

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.