Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Missed offset feature within row-fluid #2394

Closed
wants to merge 1 commit into from
Closed

Missed offset feature within row-fluid #2394

wants to merge 1 commit into from

Conversation

grongor
Copy link

@grongor grongor commented Mar 4, 2012

I missed the offset feature within row-fluid. I tried to edit the mixins.less file like this and it worked for me so please check it if it doesn't have any hidden problems.

…less file like this and it worked for me so please check it if it doesn't have any hidden problems.
@BenjiZombie
Copy link

As far as I tested it, it works for me. Proportions are correctly computed. Good job!

@BenjiZombie
Copy link

In retrospect, I would modify your code slightly, although this will not be compatible for IE < 9:

  1. Remove the "!important" from the "offset" function.

  2. Add the following just before the default columns declarations:

    [class*="span"]:not([class*="offset"]):first-child {
    margin-left: 0;
    }

This way, I can still change fluid row styles in a media query without being overridden by the !important flag.

@mdo
Copy link
Member

mdo commented Mar 6, 2012

You'll have to use a different approach, one without !important and without the #2 approach mentioned by @BenjiZombie.

@mdo
Copy link
Member

mdo commented Apr 1, 2012

Going to close this out. We'll add the offsets to fluid when we can get it 100% right without any nasty overrides.

@mdo mdo closed this Apr 1, 2012
@joomla-agency
Copy link

Is this the solution maybe, without nasty overrides? I try it on my own installation and it works...

.row-fluid [class*="span"].offset12 {
  margin-left: 102%;
}

.row-fluid [class*="span"].offset11 {
  margin-left: 93.5%;
}

.row-fluid [class*="span"].offset10 {
  margin-left: 85%;
}

.row-fluid [class*="span"].offset9 {
  margin-left: 76.5%;
}

.row-fluid [class*="span"].offset8 {
  margin-left: 68%;
}

.row-fluid [class*="span"].offset7 {
  margin-left: 59.5%;
}

.row-fluid [class*="span"].offset6 {
  margin-left: 51%;
}

.row-fluid [class*="span"].offset5 {
  margin-left: 42.5%;
}

.row-fluid [class*="span"].offset4 {
  margin-left: 34%;
}

.row-fluid [class*="span"].offset3 {
  margin-left: 25.5%;
}

.row-fluid [class*="span"].offset2 {
  margin-left: 17%;
}

.row-fluid [class*="span"].offset1 {
  margin-left: 8.5%;
}
```css

@richardp-au
Copy link

@jooag What purpose would .offset12 serve? You'll also need to write in in LESS using variables like @fluidGridColumnWidth, etc.

And don't forget browser support. Does it work in all browsers? I assume not since the current mixins contain IE width overrides to make minor adjustments.

@joomla-agency
Copy link

It was only an first idea! I am not so familiar with github. I try to learn it.

offset12 exists in the original bootstrap.css too. In this case is offset12 uneseccary.

Best regards

@f3ndot
Copy link

f3ndot commented Jun 20, 2012

This fella seemed to has come up with a decent solution:

http://stackoverflow.com/a/10920191/1112366

@nathanpitman
Copy link

This would be a really useful addition to bootstrap. I'm just switching a project from fixed to fluid and the lack of offset for fluid was a bit of a surprise. :)

@Symmetric
Copy link

It appears that fluid offsetting is not yet implemented. Is that correct? If so, any chance you (@markdotto ?) can fix the docs here to remove the section that claims fluid offsetting works? (The example code there uses fixed-grid, not fluid).

@joomla-agency
Copy link

@Symmetric it's already in 2.1 release :-)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

8 participants