Скачать или смотреть Responsive design for interactive calculators - Breakpoints tutorial

Learn to use different breakpoints in your CALCONIC_ calculator editor to make your interactive calculator adapt to any device view. So if your user is using let's say a mobile device, the calculator becomes responsive and adapts to fit size to the small screen.

#HowTo: At the top of your interactive calculator editor, you will find different breakpoints marked as 3 device icons. Through them, you will be able to adjust the color, style, and layouts according to each user screen and to your preferences.

Large screens, laptops, and similar fall under the desktop breakpoint, and using the same logic, smaller screens fall according to the tablet and mobile device breakpoints. What's important is to check that the range of your website container meets the range of your calculator to avoid any unexpected outcomes.

Styling your calculator remains very easy. Your elements and their shared setting from your desktop breakpoint are automatically copied through different breakpoints, so what’s left is to adjust the size of your copy, colors, and highlights of the most important details and decide on the sequence (layouts) your elements should be put together.

So you have the power to create different views for different device users. Your mobile version should appear with bigger buttons and letter size while your calculator in the large screen can have a few columns and more eye-catching design.

Just keep in mind, the NUMBER of elements cannot vary, so if you add a new separator or info element in any of the breakpoints, you have to readjust the calculator in all breakpoint views so the element would fit well.

About CALCONIC_
CALCONIC_ is an online calculator builder that allows users to create an interactive calculator and add it to their website. No programming skills needed.

We also have a bunch of ready-to-use templates that can serve as a foundation on which to build their desired calculator even faster or draw inspiration for new calculator uses.

CALCONIC’s custom calculators are easy to integrate into any website that supports JavaScript or iFrame embedding, including DIY website builders like Shopify, Squarespace, Wix, WordPress, Weebly and more.
---

Follow us on:

Facebook -   / calconic  
Twitter -   / calconicapp  
Instagram -   / calconic