Html z索引阻止滚动框在CSS中工作

Html z索引阻止滚动框在CSS中工作,html,css,Html,Css,我想创建一种LinkedIN外观,其中个人资料照片位于封面照片的一半和下面文本/段落框的一半(我认为它看起来很酷),但当我实现这一点时,滚动框停止工作。我试过zline、relative和absolute,但似乎都不管用 提前谢谢,我已经坚持了一两天了 *{ 字体系列:无衬线; 框大小:边框框; } /*六个部分------*/ html,正文{高度:100%;宽度:100%;填充:0%;边距:0%;} div{宽度:100%;高度:100%;} #第二组{ 背景:#e8e8e8; 位置:相对

我想创建一种LinkedIN外观,其中个人资料照片位于封面照片的一半和下面文本/段落框的一半(我认为它看起来很酷),但当我实现这一点时,滚动框停止工作。我试过zline、relative和absolute,但似乎都不管用

提前谢谢,我已经坚持了一两天了

*{
字体系列:无衬线;
框大小:边框框;
}
/*六个部分------*/
html,正文{高度:100%;宽度:100%;填充:0%;边距:0%;}
div{宽度:100%;高度:100%;}
#第二组{
背景:#e8e8e8;
位置:相对位置;
z指数:-2;
}
/*主要课程-----------------*/
律师头{
颜色:黑色;
边际上限:0;
边缘底部:10px;
文本对齐:居中;
字体大小:65px;
填充顶部:20px;
填充底部:0;
}
/*三类,封面,侧面,滚动框*/
赖安先生简介{
高度:150像素;
宽度:150px;
边界半径:50%;
边框:4px实心#d9d9d9;
显示:块;
/*最高:50%;
左:50%*/
利润上限:-100px;
左边距:600px;
页边距底部:0;
位置:绝对位置;
z指数:5;
}
.封面照片1{
左边距:自动;
右边距:自动;
宽度:800px;
高度:200px;
显示:块;
页边距底部:0;
位置:相对位置;
z指数:4;
}
p-one{
宽度:800px;
高度:255px;
边界样式:开始;
文本对齐:对齐;
填充顶部:35px;
左侧填充:15px;
右侧填充:15px;
盒影:10px 10px 2.5px#d9d9d9;
背景色:白色;
字体大小:15px;
线高:1.5em;
边界:6px;
溢出y:滚动;
页边距底部:0;
边际上限:0;
显示:块;
左边距:自动;
右边距:自动;
位置:相对位置;
z指数:2;
}

律师出身的开发商
在成功地完成了法学学位和硕士学位后,我开始在一年内寻找工作
法律行业。不幸的是(后来发现是幸运的),这证明是非常困难的。有
之前的一些销售经验,我决定接受莫蒂默·斯宾克斯的招聘工作。在
当时,我不知道招聘需要什么,也不知道自己所在的行业
很快将在技术领域招聘

作为一名招聘人员,对科技界来说是一次大开眼界的经历。只是 通过在莫蒂默·斯宾克斯公司的工作,我开始意识到,有多少技术融入了我们的生活 日常生活。此外,我还发现了开发此类技术所需的工作深度

关于招聘,我最喜欢的部分是与开发人员会面,并谈论最新情况 技术及其个人项目。我一直很有创业精神,曾经 发现了技术的能力,我开始想出解决日常问题的方法。 当然,我没有能力或资金来建立这些想法;我曾在招聘部门工作过 了解构建网站和应用程序的成本有多高。我还认为考虑到我的年龄(当时26岁), 学习如何编写代码已经太晚了。我决定把这些想法放在脑后,然后 而是专注于我的事业

最后,我设法在一家非常受人尊敬的律师事务所获得了一个律师助理的职位 在过去的30年中,他参与了一些英国最著名的案件。我喜欢目前的工作 然而,就像法律一样,这些想法仍然在我的脑海中溃烂。我考虑过 成为一名律师,然后用这笔钱来资助各种想法的可能性。 在这一点上,我想,为什么不自己成为一名开发人员呢。我对这件事非常感兴趣 科技,如果不是现在,我们真的相信科技产业是未来。为什么不做一名教师呢 开发人员,学习所需的技能,并与我希望成为其中一员的行业内的人员建立关系网 建立我的生意的日子。在法律界从事法律职业,却知道 五年后,我计划在一个完全不同的行业建立一家公司


希望我在这个问题上没有误解你的目标,所以如果我误解了,请告诉我

无论如何,要提升配置文件图片,只需使用
marginleft:auto将其居中
右边距:自动
,然后使用
边距顶部
将其提升到上方的元素中。
margintop
的值将是个人资料图片高度的50%乘以-1

我还调整了你的封面照片,将其设置为包含标题文本的
背景图像。这固定了封面照片下方的空白

文本对齐:居中;*{
字体系列:无衬线;
框大小:边框框;
}
/*六个部分------*/
html,
身体{
身高:100%;
宽度:100%;
填充:0%;
利润率:0%;
}
div{
宽度:100%;
身高:100%;
}
#第二组{
背景:#e8e8e8;
位置:相对位置;
z指数:-2;
}
/*主要课程-----------------*/
/*三类,封面,侧面,滚动框*/
赖安先生简介{
高度:150像素;
宽度:150px;
边界半径:50%;
边框:4px实心#d9d9d9;
显示:块;
位置:相对位置;
页边距底部:0;
z指数:5;
}
.封面照片1{
左边距:自动;
右边距:自动;
宽度:800px;
高度:200px;
显示:块;
页边距底部:0;
位置:相对位置;
z指数:4;
}
p-one{
宽度:800px;
高度:255px;
边界样式:开始;
文本对齐:对齐;
填充顶部:35px;
左侧填充:15px;
右侧填充:15px;
盒影:10px 10px 2.5px#d9d9d9;
背景色:白色;
字体大小:15px;
线高:1.5em;
边界:6px;
溢出-y: