Really basic question about a landing page?

Hey everyone. I just started teaching myself how to use webflow yesterday. I have no prior coding or HTML experience. So please bear with me.

I am trying to make a simple landing page with a graphic and then a button to ENTER the website. I’m still kind of just messing around and learning the ropes. I’ve been trying to find out exactly what dimensions I need to make my canvas in photoshop to fill the entire background with one single image. The image size and format seems to be fluctuating wildly.

Does anyone know the exact dimensions? I’ve tried from 2800x1600 pixels to 800x600 pixels. If the image is too small it repeats itself over and over thus looking like total sh*t. If the image is too large its cut off and that kind of ruins the point of having any sort of art in the background.

PLEASE HELP. Thanks in advance.

Desktop - 1920wx1080h - anyway the site is responsive - but this is “the famous” desktop screen size (correct to May 19) for mockups.

Mobile - 16:9 (iPhone X for example). You can use diff image for mobile.

Related - background-size:cover - read more here:

Try this:

  • Under body put - section min-height: 100vh
  • For this section set - background image - size cover, no-repeat, center-center
  • Put inside this section “div (Inside the div - h1 + button”).
  • Set “section” to flex and align v/h the “hello” + “enter button”