How to create a fluid layout? - Post...

User 2845153 Photo


Registered User
16 posts

I am trying to build a website that will fit all screen sizes, such as mobile, desktop, TV, tablet, ect... Every time I try to view the webpage as a different size, it re arranges and messes up the site. I have done my research, and found I need a fluid layout, but how could I create one?
User 187934 Photo


Senior Advisor
20,271 posts
Online Now

Hi Damon,
Coffeecup's RSD is a great tool to create responsive websites very quickly.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 122279 Photo


Senior Advisor
14,653 posts
Online Now

Damon, a fluid layout is supposed to rearrange the contents on a website. If it didn't, the website, which looks fine on a desktop screen, will look squashed on a mobile screen, or any smaller screen. But with RSD you can be in control about when and how the contents are to be rearranged. You set a breakpoint at the width where your site is starting to look squashed or unreadable, and then you change the settings so that everything looks fine. That will probably mean that e.g. items that used to be on one line, will drop into two lines. When you have got the look that you want, you narrow the screen further and set a new breakpoint next time the page doesn't look right. And so on.
If you can't get this to work, you could attach your .rds file to a post here (or upload it to some place and let us have the url), then someone could take a look and assist you. :)
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com



Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.