Making an image position relative to the top of the page

I have 2 images that I need to slightly overlap. My first image is logo.png, and my second image is form.png My html is:
And my CSS is: #wrapper #main { margin-top: 8%; margin-right: auto; margin-left: auto; text-align:center; display:block; z-index: 1;} #wrapper #box{ margin-top: 8%; margin-right: auto; margin-left: auto; position: relative; text-align:center; top: 8%; display:block; z-index: -1;} Basically I need both images to be centered relative to screen size, and I need the 2 to overlap. With this code, both images center, but my form seems to be 8% down from my logo, rather than 8% down from the top of the screen. Is this how I am supposed to be overlapping the 2, or am I way off? Thanks!
can you provide a screenshot of how you would like this to appear..

以上就是Making an image position relative to the top of the page的详细内容,更多请关注web前端其它相关文章!

赞(0) 打赏
未经允许不得转载:web前端首页 » HTML5 答疑

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

前端开发相关广告投放 更专业 更精准

联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏