{"id":20083,"date":"2022-11-08T16:48:13","date_gmt":"2022-11-08T11:18:13","guid":{"rendered":"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/"},"modified":"2022-11-08T16:48:13","modified_gmt":"2022-11-08T11:18:13","slug":"solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed","status":"publish","type":"post","link":"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/","title":{"rendered":"[Solved] Setting CSS margin-top so that the content does not appear on screen in any device before scroll? [closed]"},"content":{"rendered":"

[ad_1]
\n<\/p>\n

\n
\n
<\/div>\n
\n
\n

I think that you are looking for the viewport height<\/code> units. Give height: 100vh;<\/code> to div1 and it will have the height of the viewport browser, so the div2 will be always out of the viewport. Here<\/a> you have more info about css units. And here<\/a> the browser support.<\/p>\n<\/p><\/div>\n

<\/div>\n<\/div>\n

<\/span> <\/p><\/div>\n<\/div>\n

[ad_2]<\/p>\n

solved Setting CSS margin-top so that the content does not appear on screen in any device before scroll? [closed] <\/p>\n","protected":false},"excerpt":{"rendered":"

[ad_1] I think that you are looking for the viewport height units. Give height: 100vh; to div1 and it will have the height of the viewport browser, so the div2 will be always out of the viewport. Here you have more info about css units. And here the browser support. [ad_2] solved Setting CSS margin-top … Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[320],"tags":[464,346,388],"class_list":["post-20083","post","type-post","status-publish","format-standard","hentry","category-solved","tag-css","tag-html","tag-jquery"],"yoast_head":"\n[Solved] Setting CSS margin-top so that the content does not appear on screen in any device before scroll? [closed] - JassWeb<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"[Solved] Setting CSS margin-top so that the content does not appear on screen in any device before scroll? [closed] - JassWeb\" \/>\n<meta property=\"og:description\" content=\"[ad_1] I think that you are looking for the viewport height units. Give height: 100vh; to div1 and it will have the height of the viewport browser, so the div2 will be always out of the viewport. Here you have more info about css units. And here the browser support. [ad_2] solved Setting CSS margin-top ... Read more\" \/>\n<meta property=\"og:url\" content=\"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/\" \/>\n<meta property=\"og:site_name\" content=\"JassWeb\" \/>\n<meta property=\"article:published_time\" content=\"2022-11-08T11:18:13+00:00\" \/>\n<meta name=\"author\" content=\"Kirat\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Kirat\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/\"},\"author\":{\"name\":\"Kirat\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31\"},\"headline\":\"[Solved] Setting CSS margin-top so that the content does not appear on screen in any device before scroll? [closed]\",\"datePublished\":\"2022-11-08T11:18:13+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/\"},\"wordCount\":85,\"publisher\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#organization\"},\"keywords\":[\"css\",\"html\",\"jquery\"],\"articleSection\":[\"Solved\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/\",\"url\":\"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/\",\"name\":\"[Solved] Setting CSS margin-top so that the content does not appear on screen in any device before scroll? [closed] - JassWeb\",\"isPartOf\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#website\"},\"datePublished\":\"2022-11-08T11:18:13+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/jassweb.com\/solved\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"[Solved] Setting CSS margin-top so that the content does not appear on screen in any device before scroll? [closed]\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/jassweb.com\/solved\/#website\",\"url\":\"https:\/\/jassweb.com\/solved\/\",\"name\":\"JassWeb\",\"description\":\"Build High-quality Websites\",\"publisher\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/jassweb.com\/solved\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/jassweb.com\/solved\/#organization\",\"name\":\"Jass Web\",\"url\":\"https:\/\/jassweb.com\/solved\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png\",\"contentUrl\":\"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png\",\"width\":693,\"height\":132,\"caption\":\"Jass Web\"},\"image\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31\",\"name\":\"Kirat\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1775193939\",\"contentUrl\":\"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1775193939\",\"caption\":\"Kirat\"},\"sameAs\":[\"http:\/\/jassweb.com\"],\"url\":\"https:\/\/jassweb.com\/solved\/author\/jaspritsinghghumangmail-com\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"[Solved] Setting CSS margin-top so that the content does not appear on screen in any device before scroll? [closed] - JassWeb","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/","og_locale":"en_US","og_type":"article","og_title":"[Solved] Setting CSS margin-top so that the content does not appear on screen in any device before scroll? [closed] - JassWeb","og_description":"[ad_1] I think that you are looking for the viewport height units. Give height: 100vh; to div1 and it will have the height of the viewport browser, so the div2 will be always out of the viewport. Here you have more info about css units. And here the browser support. [ad_2] solved Setting CSS margin-top ... Read more","og_url":"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/","og_site_name":"JassWeb","article_published_time":"2022-11-08T11:18:13+00:00","author":"Kirat","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Kirat"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/#article","isPartOf":{"@id":"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/"},"author":{"name":"Kirat","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31"},"headline":"[Solved] Setting CSS margin-top so that the content does not appear on screen in any device before scroll? [closed]","datePublished":"2022-11-08T11:18:13+00:00","mainEntityOfPage":{"@id":"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/"},"wordCount":85,"publisher":{"@id":"https:\/\/jassweb.com\/solved\/#organization"},"keywords":["css","html","jquery"],"articleSection":["Solved"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/","url":"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/","name":"[Solved] Setting CSS margin-top so that the content does not appear on screen in any device before scroll? [closed] - JassWeb","isPartOf":{"@id":"https:\/\/jassweb.com\/solved\/#website"},"datePublished":"2022-11-08T11:18:13+00:00","breadcrumb":{"@id":"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/jassweb.com\/solved\/solved-setting-css-margin-top-so-that-the-content-does-not-appear-on-screen-in-any-device-before-scroll-closed\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/jassweb.com\/solved\/"},{"@type":"ListItem","position":2,"name":"[Solved] Setting CSS margin-top so that the content does not appear on screen in any device before scroll? [closed]"}]},{"@type":"WebSite","@id":"https:\/\/jassweb.com\/solved\/#website","url":"https:\/\/jassweb.com\/solved\/","name":"JassWeb","description":"Build High-quality Websites","publisher":{"@id":"https:\/\/jassweb.com\/solved\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/jassweb.com\/solved\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/jassweb.com\/solved\/#organization","name":"Jass Web","url":"https:\/\/jassweb.com\/solved\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/","url":"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png","contentUrl":"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png","width":693,"height":132,"caption":"Jass Web"},"image":{"@id":"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31","name":"Kirat","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/person\/image\/","url":"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1775193939","contentUrl":"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1775193939","caption":"Kirat"},"sameAs":["http:\/\/jassweb.com"],"url":"https:\/\/jassweb.com\/solved\/author\/jaspritsinghghumangmail-com\/"}]}},"_links":{"self":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/posts\/20083","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/comments?post=20083"}],"version-history":[{"count":0,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/posts\/20083\/revisions"}],"wp:attachment":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/media?parent=20083"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/categories?post=20083"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/tags?post=20083"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}