Unbounce pages use a responsive design style, so when you create your desktop page and then optimize it for mobile devices, it should look good on tablets too, since it will automatically resize to fit the screen.

This is not happening for a page we have designed. on tablets, page is cut vertically on right side. so, it’s visible only 2/3 vertically and there is no horizontal scroll bar too.

Hmm, that is strange. Maybe something is “out of bounds” which is causing the page to display at the incorrect width. Check if anything is out of bounds. Otherwise, you might want to open a support ticket with Unbounce for them to see the page and troubleshoot further.

Hmm, that is strange. Maybe something is “out of bounds” which is causing the page to display at the incorrect width. Check if anything is out of bounds. Otherwise, you might want to open a support ticket with Unbounce for them to see the page and troubleshoot further.

Just to add to what Nicholas has said, Unbounce is pretty good with responsiveness already.

However, if you want further control on how your page elements resize, you can also try resizing them for different screen sizes using @media CSS queries in your custom CSS.

Refer: Using CSS @media queries, Common screen size break points, Adding Custom CSS to Unbounce

yes, all margins are good. created a ticket

Just to clarify… unbounce pages are “semi-responsive” there is one break point at 600 pixels. Before I started using unbounce I had several conversations with Oli, Ryan, and others about the nature of this single break point and how I wasn’t a fan.

Ultimately this is why I chose to use the platform. When you are designing a landing page it isn’t like a “regular page”. Given the fact that landing pages (most landing pages anyways) singularly focused you can design/build them in such a way that when the scale to iPad size all of the elements on the page look good and are easy to use. 

This is a page we just recently launched. I changed my screen size to ipad and this is how it looks. Yeah the margins are tight at the top, but its fine. Then when you scroll down that is one of the sections, looks more than fine on iPad.

I asked for more breakpoints, but the response I got was in order to do that it would make the editor far more complicated and take away from unbounce’s core mission of allowing marketers to create landing pages w/out the need for dev.

So far, I have been more than happy with the look of the pages we have created at all sizes. Is it 1000% perfect, no. Is it way better than what we were doing before (no landing pages) heck yeah.

My advice is to set your page to 1000px and crop all of your hero images full-width graphics to 1600px. We find that gives the best results.

Joe 

This is nice to know, Joe. Curious, when you reccomend the 1000px page width and 1600px hero image width, does this apply regardless of whether you’re using parallax layouts or not? I always struggle with getting the ideal layout for full width parallax image sections.

I/we almost never use parallax sections… and when I say almost I really mean never. Why? Good question, we just don’t.  Wish I had more insight into how to make that better but it’s not something I have much visibility on.

Joe

@Joe_Savitch I agree that designing a responsive landing page tends to be easier because there more focused on a singe cause, however that being said Unbounce technically is not responsive it is adaptive and the breaking point is not ideal. Realisticly 320 - 480 is good for most iPhones but more and more phones on the market today assume much wider break points and tablettes really are very different than phones. IPad’s break point is usually 768 -1024.

Although I agree that most designs “scale” well on Unbounce, it’s really only 'cause they have been designed with limitations. We have come across many designs that simply do not work well, and when you get into custom fonts and embedded scripts problems arise.

We tend to lean toward building all our pages out at 980px wide. This seams to solve most problems across devices and viewports.

Personally, thinking of the future, I would like to see a more flexible responsive framework being used, something like Foundation. For more advance users that means more flexibility in the CSS panel. For the average user it just means a better cascading experience across browsers. I would also very much like to see a “tablette” preview as well.

@Nicholas parallax and liquid backgrounds in general are always problematic even with the best of responsive frameworks. But, for Unbounce we have found that 1280px wide works best considering the 980px wide mentioned above.

On a final note, I’m a big believer of designing mobile first. We create mobile desings that are different than the desktop view for almost every project. This enables us to be way more flexible. Granted it’s more work and a creates a bit more of a mess inside Unbonce having to hide and unhide multiple panels but In the end it means a better experience and better conversions.