How i can create a responsive website/ web app in bubble.io. Actually i am finding this task difficult and time consuming to do.
What are the first and last steps you would and take to start designing your web app and making it responsive at the same time. Step by step procedure would be very helpful for me and other thousand bubblers as i think this is the area where consumption of time is very much.
So please be descriptive and your best practices and advices.
Hi there, @Priyanshu-Goyal… I’m not trying to be a jerk by throwing a bunch of links at you (like a “let me Google that for you” kind of thing), but there is plenty of great content out there on responsive design in Bubble, and you should definitely check some of it out.
It’s really about setting up page structure using groups. Once you’ve divided the page into the relative parts, creating breakpoints is straightforward.
Thank you all for your contribution, I’m using the new responsive engine and after following and adapting the videos to the new engine i got the responsiveness but I have the problem where I’d like to have bigger pictures in desktop mode, like the ones on the bottom in this screenshot, but I get the upper ones if I make the columns responsive:
While The upper ones are good on mobile as I want 2 columns with pictures of 150 px max but they stay small on desktop while the bottom ones aren’t responsive and stay 4 columns instead of 2:
The main problem is that I can’t have fixed columns AND minimum column width togheter but it has to be variable columns, so they get the minimum width of the image inside.
I tried many things, the only thing that I have to try is changing the column/row/fixed container layout.
I’m using column for index and all the children are like the parent as I suppose that it’s the best option also since I’m aiming mostly at smartphones