Fluid layouts have the ability to resize dynamically with their container. In web design fluid layouts typically resize based on the width of the browser window, with percentage widths specified in the page styling rather than widths fixed in pixels or ems.

learn more… | top users | synonyms

41
votes
6answers
42k views

What is the exact difference between fluid and responsive design?

What is the exact difference between fluid and responsive design? I am bit confused about fluid and responsive design. Fluid is the one where we give width in percentages so that design will look ...
14
votes
3answers
3k views

What does Responsive Web Design actually mean…?

I've gone through with many articles to understand exact difference between Responsive and Fluid web design. But couldn't make my understanding differentiate between these two. Can anyone help me to ...
6
votes
1answer
277 views

How to achieve this layout in a responsive design?

I am currently, working on the below layout and I am finding it difficult to maintain alignment and layout. Below is the layout I want, in blue border.
5
votes
2answers
193 views

How to calculate the best width of a text element

I am developing a visual editor where the nodes in the editor can contain text. The size of the text can vary, and can contain any character. Since it is important for me to minimize the size of the ...
5
votes
2answers
317 views

A modern image gallery: fluid or elastic?

I am new to UX and IA and everything about interface and solution design. I need to do a simple image gallery based on grids. I read about responsive design and media queries. Ok, in wide screen i ...
3
votes
2answers
116 views

Decreasing the display size of posts on the home page, depending on the amount of content

I am developing a RSS news feeder. I want to keep it minimal and just to the point, that is the posts. Some bloggers that post news mainly, sometimes they just write content like "You have to look at ...
3
votes
1answer
106 views

Using a column based layout for text content

Text typically falls into a single column on the majority of websites - the user reading down the page. The only scroll motion therefore is downward. I've been experimenting recently with the CSS3 ...
2
votes
2answers
533 views

Where should the submit button be for these type of compact forms? (bootstrap 3 module)

So Im creating a compact forum module for bootstrap 3. The project is opensource on github. This type of forms are good in two ways: Its so 2014 and very user friendly on mobile devices. But Im ...
2
votes
2answers
533 views

How to make fluid web site consistent

I am redesigning my fixed width web site to be (more) responsive and ran into some problems: For one, I really like using a fluid width layout since a lot of visitors are using my web site in (much) ...
2
votes
4answers
413 views

Small form, big page

When you have a huge canvas (think: responsive design) but the content you need to display is very narrow, how do you prevent it from looking awkward? Center it, left-align, find more stuff to fill ...
1
vote
1answer
26 views

Custom Type and Mobile Optimized layout for Email Clients

I'm in need of your help in regards of Email Clients. I'm looking at developing some marketing email templates that have custom fonts and can be mobile optimized. I've been searching around the web ...
0
votes
2answers
4k views

Suggest good max-width for fluid width design

My websites uses fluid width design. The CSS looks like this: #wrapper { min-width: 960px; width: 90%; max-width: 1200px; } The min-width must be 960px but I am open to suggestions ...
0
votes
1answer
230 views

Full width background images

I want to allow users to upload full-width background images that would take up the entire width of the page (with a set height of 500 pixels). However, the issue is, what should be the minimum ...
0
votes
1answer
76 views

Mixing fluid and fixed interfaces? Sometimes we have to. (non web)

At the time I'm redesigning some desktop application. Look at the illustration below. Window on the LEFT side of the illustration should be resizable since it contains table which can have any ...
-2
votes
1answer
148 views

How to inform a designer to use a grid for responsive CSS? [closed]

How do you share information on a grid with a designer / design process, such that it helps in further coding of CSS of a responsive interface? Do you use any tools in a mock? Do you show blueprints ...