Fatal编程技术网
  • html/
  • Html 使用高度100%会将元素抛出屏幕

Html 使用高度100%会将元素抛出屏幕

html css

Html 使用高度100%会将元素抛出屏幕,html,css,flexbox,height,Html,Css,Flexbox,Height,我目前正在创建一个单页应用程序。在它上面，我需要所有的东西都集中在屏幕上 但是当在下面显示这些卡片时，它们的顶部会离开屏幕而不显示。如果我把高度降低100%，它就会出现，但内容不再集中在屏幕上 html， leofullscreen先生{ 宽度：100%； 高度：自动； 底部：0px； 顶部：0px； 左：0； 位置：绝对位置； } .集装箱{ 身高：100%； 显示器：flex； 证明内容：中心； 对齐项目：居中； } .表格签名{ 宽度：100%； 最大宽度：330px； 填充：15px；

我目前正在创建一个单页应用程序。在它上面，我需要所有的东西都集中在屏幕上

但是当在下面显示这些卡片时，它们的顶部会离开屏幕而不显示。如果我把高度降低100%，它就会出现，但内容不再集中在屏幕上

html，
leofullscreen先生{
宽度：100%；
高度：自动；
底部：0px；
顶部：0px；
左：0；
位置：绝对位置；
}
.集装箱{
身高：100%；
显示器：flex；
证明内容：中心；
对齐项目：居中；
}
.表格签名{
宽度：100%；
最大宽度：330px；
填充：15px；
保证金：0自动；
}
#随机化选项{
边缘顶部：0.2rem；
边缘底部：0.2rem；
}

玛格丽特
ServletForgotPassword
支票用户
参数
预期回报值
ServletForgotPassword
支票用户
参数
预期回报值
ServletForgotPassword
支票用户
参数
预期回报值
您需要删除
justify content:center规则，并最终将
100vh
值设置为
html、.leofullscreen
的
height
，以避免元素设置在中间，但在两侧溢出：(

如果满足您的要求，请参见下面的示例



html，
leofullscreen先生{
宽度：100%；
高度：100vh；
底部：0px；
顶部：0px；
左：0；
位置：绝对位置；
}
.集装箱{
身高：100%；
显示器：flex；
对齐项目：居中；/*这也是一种阻碍*/
}
.表格签名{
宽度：100%；
最大宽度：330px；
填充：15px；
保证金：0自动；
}
#随机化选项{
边缘顶部：0.2rem；
边缘底部：0.2rem；
}



玛格丽特
ServletForgotPassword
支票用户
参数