Skip to content

Is it possible to mix (nested) fluid grid and responsive design? #4946

@donaldpipowitch

Description

@donaldpipowitch

Hi everyone,

as far as I know it is not possible to mix fluid grid and responsive design, am I right? The source code says that "all grid-sized elements [become] block level again".

I think this is a good default behaviour, but not always desired. E.g. someone would want to use responsive design so he has

  • 3 column design on desktop: main content | navigation | meta information
  • 2 column design on tablets: main content (with meta information on bottom) | navigation
  • 1 column design on smartphones: main content (with navigation on top and meta information on bottom)

But he also wants to use the width of "main content" as the width for a nested fluid grid, so he can use "span6" and "span6" to use a "two column layout" within "main content" itself.

I hope you get what I want. To be clear: I recommend to introduce a "container-fluid-important" class which explicitly ignores responsive design rules. It behaves explicitly like "container-fluid", but preserves row-fluid and spans from "becoming block level again".

What do you think?
(If this Twitter Bootstrap already provides this behaviour - shame on me!)

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions