Different look in published site and live preview

Hello Webflow People!

I am having an issue with my live preview and the preview I publish and send to a friend of mine.
On the first picture you will see what I see if I turn on live preview for desktop, on the second one you see what my friend sees if he opens it in his preview. Let me know please what is missing or what can I do to see the right thing. The “scroll” is not on the right spot…


Thank you!


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Hello.
Maybe you should clear the browser cache?
If that does not help you can reset the height and width of Div block 40. No Max. width etc. only ‘height’ and ‘width’ for desktop and then, if necessary adjust them for the other widths

Hi @H_David,

When I look at your preview link it is an Absolute positioned item, which means it will be different for everyone based on their screen size. For my screen, this is what I see:


As you can see is it further to the center. If you are on a smaller screen laptop, like a 11" or 13" MacBook or MBP the height of the screen is smaller.

I am on a huge Ultra-Wide Monitor.

Please let me know if you have any other questions,

~ Happy Designing ~
Brandon

Hello Brandon!

I am total new to Webflow, and developing any websites. I have issues with these absolute positioned elements. I would like to position the headlines (About me, Services, …) that one half covers the black Div block and the other one does not, it is overlaping the Div block (see pic below).

I was looking at Webflow Acedemy, have seen 80% of the courses but the responsibility is not clear at all. Is it possible to develop a Website in Webflow for every single device, that works and operates well, looks fine and so on?

Cheers!
David

Hello.

No it is not the issue… See above (“SCROLL”).

Hi @H_David,

The layout could be the culprit here. Not sure what your over design is supposed to look like. But when you are dealing with positioning, nothing is absolute in responsive design, even though the position is set to absolute. When you start resizing, that piece will be set to absolute to the parent that is set to relative. If the absolute see a different parent element as relative that could be a reason why it doesnt show exactly the same on every device.

As for designing for every device, that is just impossible. Since every different device has a different resolution and a different size. What we try to do it get the site(s) to work on as many closely related devices as possible. But what you want to make sure of is that you designed works on ALL modern and up to date browsers and the most commonly used devices.

You can use a testing tool like BrowserStack to test mostly all devices out there.

Please let me know if you have any other questions,

~ Happy Designing ~
Brandon

Hello @QA_Brandon

Thank you for your tipps!

I did the Free Trial on Browser Stack, but “oh, boy…”, it looks so different on other systems or devices however Webflow live preview shows it correctly. :frowning: I do not have a paid account or hosting package yet, is it possible that this causes some issues? I mean, if you open my link, you open it in webflow, not on the proper site…

Anyway, can I solve the responsive problems in this way: Some sections are not working properly on my phone (iPhone 7) but I see it properly on my live preview on webflow, so I thought I rebuild the section, and the new one will be only visible on mobile, still the actual section only on tablet and desktop? Can it cause any issues on the site? I do not find any help, freelancer or support on solving my problems, I try to handle them, but after a while I have to ask for more serious help… :confused:

Cheers!
David

@H_David,

Is the only issue you are seeing on your iPhone 7?

I can take a look a bit later and see what’s going on and get back to you.

Best Regards,
~ Brandon

Hello!

I am havin some issues with the live preview and the compatibility with other devices… What do you suppose on this issue? It is not open yet, not online, it is only on Webflow. After having a domain and making it live, will it be easier and better to take control over these problems? I gotta turn to official Webflow support, I am not finding solutions for this sadly… :confused:

Thank you @QA_Brandon for the support!

Hi @H_David,

Sorry for the delay here. I ended up with a migraine and was down for the count.

As for Webflow support, these are design issues and we will send you here anyways.

Lets see if anyone in the community can help too: @mattvaru @Noah-R @vincent @PixelGeek any thoughts here?

Best Regards,
~ Brandon

Hi @QA_Brandon,

Thank you! Doing this for the first time, so I gotta get use to these things. Problem solving… :slight_smile:

Cheers!

Hi @H_David,

Yes, for Design related questions, this is your location for support, advice, and light coding support. Webflow Support will help you with bugs, billing inquiries, anything that is product specific.

However, when I look at your share link, it looks like you have changed your design on your initial question.

Please let me know if you have any other questions,

~ Happy Designing ~
Brandon

Hi @QA_Brandon

Yes I have done some changes, I hope it looks fine now.

I have an additional question. I would like to go for a BASIC package for the first month, just to test out how it works… After publishing to a domain, do I have to buy an additional storage/space for my website and content, or does Webflow include that either? I did not find any infos about this topic yet.

Thank you
David

@H_David,

The Basic Hosting Plan is fine, just as long as you are not using any CMS collections. If you are using CMS for blogs, projects, etc. You will need to be on the CMS Hosting Plan to start with.

Best Regards,
~ Brandon

@QA_Brandon Thank you.
Is there any number, how much gigabyte is provided? I will need no CMS, do you thing the Basic
package will be suitable for my existing site?

Cheers
David