Inuit.css - Another CSS framework | Hacker News Reader

Inuit.css - Another CSS framework

csswizardry.com

72 pointsfranze27 comments

Looks nice. But there should be some way to see the source without downloading a zip.

Github is an easy answer, something like what the HTML5 Boilerplate or backbone.js does would be even cooler.

Wow, on Hacker News, cheers guys!

I'm Harry, the guy who made inuit.css. There is a link to inuit.css in the page's h1, which I know is way too hidden: http://csswizardry.com/inuitcss/css/inuit.css

I'm a designer/front-end dev at heart so I don't know Git(hub) at all. I have made an account about an hour ago though and I'm hoping to get inuit.css on there asap. Just gotta learn it now.

Cheers, H

Any reason for using height:101% instead of overflow-y:auto for scrollbars?

Also, shouldn't the utf-8 declaration be at the top before a massive block of commented text? Though in practice I'm not sure if it matters much either way.

Thanks

overflow-y, although relatively stable, has only been officially proposed in CSS3. So I could (and might) use overflow-y, but the height:101%; is a hangover from when overflow-y was a non-standard bit of CSS.

I don't dislike the overflow-y method, I just used the one I've used for year. I might update inuit.css to use the more obvious overflow-y property soon though.

Good spot on the charset declaration though. Thank you very much. I'll update on my lunch break or something :)

Thanks, H

The brief tutorial that appears after you finish creating a Github repository is the quick and easy way to get it up on Github. Install git, create a github repo, then follow that tutorial and you're up and running.

I just created a gist here: https://gist.github.com/942218

Should be a nice middle ground?

perhaps a nice cheat sheet may be up your street? I found looking at a blueprint one a nice way to get an overview of what is available.

Thanks, I had no idea that was a link. The color is the same as your logo color, which is tres confusing.

I was skeptical at first and skimmed through inuit.css - I must say the "debug" stuff, in particular checking for images without alt tags and links without titles, et cetera, is rather nice. I'd like to see this packaged in a Sass/SCSS format too.

Looks cool (pun intended). The website could use more demo pages, though. It could also have a section "Sites using Inuit.css" with screenshots. Why would I use Inuit.css instead of Blueprint ( http://www.blueprintcss.org/ )?

Why would I use Blueprint, when I could use the excellent 960 ( http://960.gs/ ) by Nathan Smith? To me all of the above choices are good as long as there is a way to use Sass ( http://sass-lang.com/ ) like in Compass ( http://compass-style.org/ ) to remove the presentation code from your markup, i.e. span-8, grid_4, etc., using sass. Compass defaults to Blueprint, but thankfully there is the excellent compass-960 plugin ( https://github.com/chriseppstein/compass-960-plugin ) so you also can use 960.

Anyway, I will try Intuit and see how it compares to the above. Thanks.

> Why would I use Inuit.css instead of Blueprint ( http://www.blueprintcss.org/ )?

Make your viewport smaller than the default page width of the website. Do you see horizontal scroll bars? yes for bluebprint, no for innuit. Which makes innuit the clear winner for me.

Some weeks ago I spent some time skimming through various CSS frameworks, and ended up usinig emastic ( http://code.google.com/p/emastic/ ) because it can be made to work well with small browser viewports, and because you can use em/ex instead of px for denoting sizes.

Those are all great ideas, thanks. I'm already considering an 'inuit.css in the wild' type section, as soon as enough people start using it in production.

I definitely need to scale the site up somewhat as it currently doesn't do such a great job on the selling front.

This took off far more quickly than I expected. I only launched five days ago...

Cheers for the feedback :)

Agreed. I need to see some usage.

As a developer, I'd like to thank front-end designers and CSS experts for style-sheets like this, but why isn't there a demo page ? It seems kind of obvious since this contributes to a project's look-and-feel.

A demo page would have been nice but I went for it anyway. I applied this to an internal app at work and it went to a 5/10 to 8/10 with about 45 minutes of work. It's really nice for us not-so-good-at-designing types.

A demo page would have been nice

Documentation would have been nice, too.

the page itself is a demo of inuit.css (view source!).

> I’ve put a little system in place where, instead of margin-right:20px;, the grid items have a margin-left:20px; applied. This pushes them all a little too far across but doesn’t break if you put them in a container that is 20px too wide. Then, once all that’s happened you pull the container back by 20px.

That doesn't really make sense to me. Why not just use :last-child, and use a JS fallback if you really want to support browsers that don't support that?

Why use :last-child and a JS fallback when you can use CSS without a JS fallback?

One means more work on my behalf, and the other is to support a minority of users.

Question: I viewed the site on my G2 and could not zoom or otherwise change the size. Why is that? Is this controllable using Inuit?

Sorry, "body { width:940px; }", really?

It's 2011, we should be using fluid layouts (see blueprint-liquid, emastic).

Deleted comment

> IE6 is a perfect baseline to start from

IE 6 is a terrible baseline to start from its almost a decade old, Microsoft is trying to wean users off it - making your website look nice in IE6 isn't helping this cause.

Make it just about functional in IE6, and perhaps include a notice to the user that recommends they upgrade.

Of the 60,000 views I've had in the last 3 weeks, there have been 7 from IE6.

Very few people actually use IE6 outside of China and South Korea.

http://ie6countdown.com/

Don't you think it's time Nudge along the final few percent?

Reply on news.ycombinator.com