Stack Overflow
Stack Overflow

Questions tagged [neat]

Neat is an open source semantic grid framework built on top of Sass and Bourbon.

What is it about?

Neat is a semantic grid framework built on top of Sass and Bourbon. It is simple enough to get you up and running in minutes, and powerful enough to handle any responsive layout you can dream of.

Why another grid framework?

Because we are not happy with other frameworks. We built Neat with the aim of promoting clean and semantic markup; it relies entirely on Sass mixins and does not pollute your HTML with presentation classes and extra wrapping div's.

It also aims to stay as lightweight as possible; just enough to handle the most common grid uses in modern Web design.

Is it responsive?

Yes. You can even change the grid settings in a specific breakpoint.

Alright. How do I get started?

Install Neat and its dependencies, read the documentation and check the examples page if you get lost. If you want to use Neat on your Rails app, there is a gem for that. Feedback? If you think something is broken or can be improved, fork the repo. You can also tweet your questions or suggestions at https://twitter.com/kaishin and https://twitter.com/kylefiedler.

Bourbon and Neat are maintained and funded by thoughtbot, inc.

Links

Related tags

305 questions
0
votes
1 answer

Grunt compiling SASS differently on another machine

I have been working on a project on a Mac Mini in our office, but when I have pulled the GIT repo and started working on my Macbook Pro at home the SASS isn't compiling the same CSS. The exact same node modules are being used, and it displays no…
Chris
  • 1,557
  • 5
  • 19
  • 36
0
votes
1 answer

Increase Outer Container Width

I'm building a WordPress theme on Bourbon and Neat. I am using Codekit to manage/compile SASS. I looked at the bourbon Docs and added this to my variables.scss file: $max-width: em(1200) !default; After this complies, however, the width of the…
Zach Russell
  • 1,060
  • 2
  • 13
  • 27
0
votes
2 answers

neat/bourbon responsive automatic rows

Bourbon/Neat has a neat feature that provides automatic rows (http://neat.bourbon.io/examples/) but I cannot get this feature to become responsive. In my example I use 4 columns for large screens, and 3 columns for medium screen. The 4-columns…
shaft
  • 2,147
  • 2
  • 22
  • 38
0
votes
1 answer

Bourbon Neat @include row(table) function

Please help. I'm using Bourbon Neat 1.7 and trying to add and display a second row. All the info currently displayed shows on one line, should be 2 lines. My plan is to attach a record set and display the records, line by line. My scss code .third…
user2548132
  • 13
  • 4
0
votes
2 answers

Bourbon NEAT: 4rth column not being inline

I can't understand what I'm missing in my sass, but my 4rth column in my grid wont go inline, but only 3 cols will do: I want a simple 4 column grid, so I did: My Markup
  • My item
    • Gibson
    • 2,055
    • 2
    • 23
    • 48
    0
    votes
    0 answers

    Shifting the grid to right and vertical menu on left

    i am trying to make a page with vertical menu on left and on right the outer container. Now ,I have placed the vertical strip outside the outer-container using this css .leftVerticalNavTab { background-color: #313131; color: white; height:…
    Cloudboy22
    • 1,496
    • 5
    • 21
    • 39
    0
    votes
    1 answer

    Multiple column/gutter sizes across Bourbon Neat breakpoints

    I'd like to create a flexible responsive grid using Bourbon/Neat, that not only varies the number of columns, but also allows me to configure the gutter spacing between columns, across breakpoints. So in theory, something like this would…
    amigolargo
    • 800
    • 2
    • 7
    • 24
    0
    votes
    1 answer

    Why is there an offset in media queries?

    I was using Bourbon Neat to create some responsive layouts. However, I found out that the media query that I use was offset by around 70px.. I set a breakpoint of 640px for tablets (as shown in the CSS inspector However, when i try to adjust the…
    Chris Yeung
    • 2,613
    • 6
    • 34
    • 57
    0
    votes
    1 answer

    Why is the output wrong when using neat to generate Media queries

    Okay so I have a project which I use SASS to compile to CSS using gulp, and I use Bourbon and Neat for the grid system. I find it weird the following is not already responsive. Jade Template: article.fleet .container .row …
    Chris Yeung
    • 2,613
    • 6
    • 34
    • 57
    0
    votes
    1 answer

    Bourbon Refills: Tabs in IE8

    Any one know how to get the tabs from Bourbon Refills to work in IE8? I keep getting the tabs stacked on top of each other vs side by side. I've added Selectivizr thinking it would correct the situation, but only fixes the grid from Neat.
    Joey Kirk
    • 23
    • 3
    0
    votes
    2 answers

    Neat new-breakpoint

    I'm using neat bourbon and try to use its new-breakpoint mixin but it doesn't work. I can already say that I loaded first bourbon, than grid and breakpoints.scss and than neat So I can see changes when i write: @include media(max-width 500px) { …
    Giorgia Sambrotta
    • 1,133
    • 1
    • 15
    • 45
    0
    votes
    1 answer

    Sass @each pass variable to mixin

    I'm trying to create some BS-like classes for a grid, using Bourbon Neat grid mixins. My code looks like this: @each $num in 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12 { .span#{$num} { @include span-columns(#{$num}); } } What I want to happen is…
    abpetkov
    • 884
    • 5
    • 11
    • 29
    0
    votes
    1 answer

    setting breakpoints in sass with min and max width

    Hey guys i am trying to work on a responsive layout but somehow i am not able to fix the min width for this one. $mobile: new-breakpoint(max-width 480px 4); $tablet: new-breakpoint(max-width 768px 8); $desktop: new-breakpoint(max-width 1336px…
    designerNProgrammer
    • 2,621
    • 5
    • 34
    • 46
    0
    votes
    1 answer

    Use Bourbon with Bitters and Neat

    I want to use Bourbon with Neat and Bitters for my next project. I have installed all three but I have no idea how to proceed. Do I use the three folders separately in my project folder or do I need to add the different imports to _bourbon.scss so I…
    Eclectic Eccentric
    • 11
    • 1
    0
    votes
    2 answers

    HTML line spacing

    This is a problem I have had for a long time and although it seems like a small thing my ocd will never let it go. the basic question has to do with the HTML code itself. Is it at possible to have a line of code go onto a new line but still have it…
    TheLovelySausage
    • 3,838
    • 15
    • 56
    • 106
    1 2 3
    …
    20 21