Stack Overflow
Stack Overflow

Questions tagged [fluid-layout]

A Fluid Layout, sometimes also referred to as a liquid layout, is a CSS technique in which the majority of the page components have percentage widths, and thus adjust to the user's screen resolution.

A Fluid Layout, sometimes also referred to as a Liquid Layout, is a CSS technique in which the majority of the page components have percentage widths, and thus adjust to the user's screen resolution.

Fluid layouts are one of the biggest players in Responsive Web Design (RWD) and are closely linked to CSS media queries. The goal of fluid designs are to make a website easily usable no matter the device and screen size of the visitor.

879 questions
-2
votes
1 answer

CSS grid with fluid dimensions, shrink content while keeping their aspect ratio

I want this auto grid to expand and shrink with the browser, while keeping the items centered in it, preserving their aspect ratio. Ideally : Pure CSS Keeping grid in "auto" mode (no template) (I know use-case might sound dumb, but this is…
Cyril CHAPON
  • 3,556
  • 4
  • 22
  • 40
-2
votes
1 answer

how to create two responsive cell one below the other?

I need to have two cells equal in their height and they need to be one below the other. the height of them should be change base on the windows size. (I know the windows size with js) is there possible ? screenshot of the layout is attach.
user3265943
  • 329
  • 2
  • 10
-2
votes
1 answer

CSS Fixed Header, Fluid Content, Fixed Header Responsive Layout

I am currently working on CSS layout techniques to achieve a layout like below picture
I've tried fixed poistion calc absolute position but I…
Gangadhar Jannu
  • 4,136
  • 6
  • 29
  • 49
-2
votes
1 answer

HTML / CSS fluid collapsible sidebar

I'm trying to make a toggleable sidebar for this website, and what I want is the content shown below I want the main content to be fluid and adapt after how much space it has on the screen. Is there an easy way to do this without using a framework…
squirreldev
  • 517
  • 2
  • 8
  • 18
-3
votes
1 answer

How do I create a fluid single-line form when I don't know the length of the text it contains?

I've got a one-line form that I need to style as follows: Label is left aligned Select box is fluid width Link is right-aligned (with a fixed right margin) What CSS should I use to keep each of the text fields on one line (bearing in mind the…
KemanoThief
  • 617
  • 8
  • 23
-3
votes
1 answer

Fluid Design on Mobile Device

I am attempting to code a "semi-fluid" item for a mobile site and need a bit of help. What I am looking to do is realign the layout when viewed vertical or horizontal. When viewed vertically it should be... Horizontal should be...
Carlos
  • 160
  • 1
  • 2
  • 13
-3
votes
1 answer

How to layout a fairly simple bootstrap scenario?

I am new to bootstrap and trying to layout something fairly simple using their grid system, but I am having a difficult time. Here is what I want: So basically, a title of the Report on the left. A log in button floated right. A panel with…
AngryHacker
  • 59,598
  • 102
  • 325
  • 594
-4
votes
1 answer

isotope.js - how to solve rendering wrong spaces in fluid layouts

As for the subject, I've got problems with isotope and fluid layouts. I don't think it's really an isotope problem itself. Probably some render issue browsers have when objects are treated/positioned like isotope does. Please see attachment.…
Luca Reghellin
  • 7,426
  • 12
  • 73
  • 118
-5
votes
1 answer

Liquid margins with CSS/JS

I try to create following: I have centered block width min and max width and I need to place content on left and right of it. When block's width is equal to max width, content on left and right is visible (left and right content represented by…
Сергей Репков
  • 49
  • 1
  • 5
1 2 3
…
58
59