Html 如何在flex列中的元素之间添加空间?

Html 如何在flex列中的元素之间添加空间?,html,css,Html,Css,我想在CSS中的项目之间添加一些空间,我尝试了很多方法,但都没有成功 我想要这个汉堡菜单,这是我的CSS代码和HTML(注意:我不专业!) 我有3个a标签“家庭”“产品”“关于” 我想这样分类 家 产品 关于 但是我不能在它们之间添加空格(注意:“sideitem”类是子类,“sideitems”类是父类) 。侧菜单{ 位置:绝对位置; 右:0px; 宽度:40%; 高度:100vh; 宽度:20%; 背景色:rgb(39,44,52); } .附带项目{ 位置:绝对位置; 显示器:flex;

我想在CSS中的项目之间添加一些空间,我尝试了很多方法,但都没有成功

我想要这个汉堡菜单,这是我的CSS代码和HTML(注意:我不专业!)

我有3个a标签“家庭”“产品”“关于” 我想这样分类

产品

关于

但是我不能在它们之间添加空格(注意:“sideitem”类是子类,“sideitems”类是父类)

。侧菜单{
位置:绝对位置;
右:0px;
宽度:40%;
高度:100vh;
宽度:20%;
背景色:rgb(39,44,52);
}
.附带项目{
位置:绝对位置;
显示器:flex;
弯曲方向:立柱;
右:8%;
字体系列:“非衬线”,衬线;
}
.附带项目{
列表样式类型:无;
}
.附带项目a{
颜色:白色;
文字装饰:无;

}
尝试添加
对齐项:在
中添加
之间的空格。侧项
css

使用以下代码在侧菜单项之间添加空格

.side-item{
    list-style-type: none;
    padding: 10px;
}

您需要在
中使用
justify content:space-between

请参见下面的代码:

。侧菜单{
位置:绝对位置;
右:0px;
宽度:40%;
高度:100vh;
宽度:20%;
背景色:rgb(39,44,52);
}
.附带项目{
身高:100%;
证明内容:之间的空间;
位置:绝对位置;
显示器:flex;
弯曲方向:立柱;
右:8%;
字体系列:“非衬线”,衬线;
}
.附带项目{
列表样式类型:无;
}
.附带项目a{
颜色:白色;
文字装饰:无;
}

电致发光

请考虑为您创建当前的一个问题。您想知道什么?我们希望看到一个AS SMAKSS说:看一看我们都给你的链接,看看这涉及到什么。但如果我们看不到问题,我们基本上帮不了忙,而且你的CSS本身不足以告诉我们发生了什么。我给你做了一个片段。请添加相关的HTML和框架。我该怎么做?我在使用stackoverflow方面确实有问题。我是newpadding空?@HaythamKenway这就是为什么你需要准确地告诉我们你的代码在做什么-否则我们所能做的就是胡乱猜测,而这并不是获得有用答案的有效方法!!那么我如何显示问题?我只需要在我的项目之间留出一些空间“那么我如何显示问题?”?“通过阅读,然后了解如何创建问题,然后使用您正在使用的代码编辑您的问题,以便我们可以查看@HaythamKenway您使用完全错误的方法创建侧菜单栏,请使用我的样本作为参考。您需要在
中添加一些
高度
。附带项目
也许您希望它是
高度:100vh
@KevRob在我们获得更多信息之前,没有必要尝试进一步帮助:)仅供参考,实际上不鼓励回答不清楚且需要更多信息的低质量问题能够给出具体答案的详细信息-请参阅的帮助中的“问题解答”部分。非常感谢。我有两种方法来解决我的问题。再次谢谢,还有一个问题。有没有办法增加侧边菜单的宽度?