发表新帖
发表新帖

Make <body> fill entire screen?

前端 未结
关注
10 1033
春和景丽
春和景丽 2020-11-27 11:37

I\'m using a radial gradient as the background on my webpage, like so:

background-image: -webkit-gradient(radial, 100
10条回答
  • 鱼传尺愫
    鱼传尺愫 (楼主)
    2020-11-27 11:39

    If you have a border or padding, then the solution

    html, body {
    margin: 0;
    height: 100%;
}
body {
    border: solid red 5px;
    border-radius: 2em;
}

    produces the imperfect rendering

    To get it right in the presence of a border or padding

    use instead

    html, body {
    margin: 0;
    height: 100%;
}
body {
    box-sizing: border-box;
    border: solid red 5px;
    border-radius: 2em;
}

    as Martin pointed out, although overflow: hidden is not needed.

    (2018 - tested with Chrome 69 and IE 11)

    0 讨论(0)
 看不清?
提交回复
热议问题