Can I Create a Separate but Connect Mobile Version

[jdbrowningjr (Jack Browning)]

I know the concept is that you can Develop for the Desktop and with just a few tweaks - it works for Mobile. That has Not been my experience at all! The conversion/screen change to Mobile is and always is a complete Disaster. Ive tried, % this, flexbox that, but something always trips me up and the results are not acceptable.

I am through trying to get it to behave - I have a simple question: Can I design for the Desktop and then Design for the Mobile? Is that in the same session or a different site that links (knows its a mobile device). I understand that browsers are smart enough to know what Device you are on for formatting, so it is an important point.

I do not mind taking my Content and creating a Mobile version (specifically), I just to know if and how it is possible in Webflow. Before you suggest that the Changes Do Not Go Up (when editing mobile), that is Not entirely true, some changes do - in fact the ones I need to make do… Thank you

[cyberdave (Dave S.)]

Hi @jdbrowningjr, take a peek at this video, it may help: http://help.webflow.com/lesson/responsive-web-design

Regarding the changes in mobile showing on desktop, it is likely you are making changes to “Settings” like image settings, instead of “Styles” applied to an element. CSS Styles cascade from Desktop to Mobile Portrait and a style set on Mobile Portrait cannot affect any style on a higher viewport.

Settings on the other hand, like Image Settings where you can put in an image width and height, affect all views.

I would definitely design on Desktop first, make the site design responsive on Desktop, and like you said, you will not need to make hardly any changes on mobile if the site is designed responsively on Desktop.

There is no need to create a separate mobile version of the site, it sounds like just maybe a little help is needed on the desktop design, to learn how to make that responsive.

Do you have a read-only link of site you are having issues with? Share a read-only link | Webflow University

Another thing, using a lot of element styles with fixed widths, heights or many elements with fixed position offsets will cause havoc for a responsive site. Using %, Vw/VW, em, etc units of measurement are the best way to make a site responsive, and in conjuction, use the Webflow widgets which are already responsive.

If you really wanted to create a fixed width site for mobile, you can do it, by creating a div with a set fixed width and put that on the page, i.e. a 320px fixed width container on desktop and then add your content there. I do not recommend this method, it is making the process to create a responsive site for all views a lot more difficult.

I am happy to take a look if there are some styling issues. I hope this helps!