边距底部不会在顺风中移动 div



我正试图将电子邮件组件向上移动到屏幕上,但页边空白底部没有任何作用。还有其他我必须使用的顺风工具吗?

import React from 'react'
function Email() {
return (
<div className='flex justify-center w-full items-center mb-8'>
<div className="mb-3 mx-auto xl:w-1/4 md:w-1/2 top-1/4 ">
<input type="text" placeholder="example@email.com" className="p-3 rounded-l-md sm:w-2/3 font-['DM_Sans']" />
<button type="button" className="p-3 bg-[#00ADC2] text-white font-semibold rounded-r-md sm:w-1/3  font-['DM_Sans']">Notify Me</button>
</div>
</div>
)
}
export default Email

页面上的外观

底部边距将向下推送下面的内容。

如果你想把内容向上移动,你可以在顶部尝试负边距。

顺风有点像-mt-8

最新更新