javascript - background-image center line up with margin: 0 auto with scroll-bar -
i want have centered background image vertically stretched on website. works while there no scrollbar that's move centered image, leave margin: 0 auto in place. content doesn't line background-image.
html, body { width: 100%; height: 100%; background: url('../images/page-bgr-top.png') center top repeat-x; overflow: auto; } body { background: url('../images/page-bgr-content.png') center top repeat-y; display: block; overflow: scroll; } #main-page { width: 900px; margin: 0 auto; height: 100%; display: none; } tried different solution set background-image , overflow: auto on #main-page, , nasty scrollbars right on website.
this becuase adding many css html , body
html, body { /*width: 100%;*/ removed height: 100%; background: url('../images/page-bgr-top.png') center top repeat-x; /*overflow: auto;*/ removed } body { background: url('../images/page-bgr-content.png') center top repeat-y; display: block; /*overflow: scroll;*/ removed } #main-page { width: 900px; margin: 0 auto; height: 100%; display: none; }
Comments
Post a Comment