Page 1 of 1

responsive design in HTML5 outputs

Posted: Wed Apr 12, 2017 10:16 am
by pdenchfield
Looking for best practices in setting up responsive designs for HTML5 outputs. We have 20+ outputs hosted on our documentation site that are almost all tripane right now. We want to move them to top-nav.

For example, the HTML5 skins have the web, tablet, and mobile mediums set up correctly, but the footer is super tall, which messes up mobile look-and-feel. Looking for gotchas like that :)

Thanks!

Re: responsive design in HTML5 outputs

Posted: Thu Apr 13, 2017 12:26 am
by NorthEast
There are various ways to handle responsive layout in Flare, any advice really depends on how you're approaching it and what you want to achieve.

To start with, I'd read this topic in the help:
http://help.madcapsoftware.com/flare201 ... ontent.htm

This gives you a few options for handling layout of your topic content:

(A) Flare's Responsive Layout control (Home > Responsive Layout)

(B) Foundation grid (v5.5), which is already included in HTML5 outputs.
You can use any of the Foundation styles for:
Grid layout: http://foundation.zurb.com/sites/docs/v ... /grid.html
Visibility: http://foundation.zurb.com/sites/docs/v ... ility.html


In addition to the grid layout systems above, you can also set styles for each medium in your stylesheet (e.g. phone, tablet).

Re: responsive design in HTML5 outputs

Posted: Thu Apr 13, 2017 3:42 pm
by pdenchfield
Thank you, Dave! I'll check back when I can better frame my questions :)