Super-fast Responsive Layouts with Jeet

Iā€™m still confused though what grid markup heā€™s forcing you to use though. I mean if you were going to use a two column layout, grid framework or no grid framework, youā€™re going to want (e.g. two columns float) youā€™ll want a parent and then two children elements.

Foundation and Bootstrap all ā€œforceā€ that on you but youā€™d do that same approach anyway! Thatā€™s what I donā€™t understand.

And no you are correct most donā€™t allow fractions, and while itā€™s amazing jeet offers this (since itā€™s annoying that 12 columns must be spread over 100%) itā€™s not exactly something Iā€™d switch over to for in exchange of all the functionality of Foundation or Bootstrap.

What solution are you talking about?

ā€¦

ā€¦

Thank you.

What HTML could you possibly want though that frameworks force you to avoid? Thatā€™s what I donā€™t get. A two column floated layout will make you (if you know what you are doing) have a parent and then two floated elements side by side. A framework encourages that idea with their structured approach.

Iā€™m still waiting on an example that shows where this isnā€™t feasible with frameworks.

Again, not trying to be rude but I just donā€™t see what frameworks are restricting here. Give me an example.

Also, using grid layout basically only sets the width and floats - leaving design and everything else up to you.

I might very well be having a brain fart and there is an obvious restriction that Iā€™m not thinking of! Not saying Iā€™m right here at all; genuine curiosity here. Wasnā€™t aware of any HTML restriction with frameworks.

If youā€™re adding ā€˜contentā€™ directly into a div that has some utility classes for a grid system, like Bootstrap or Foundation. Youā€™re tying that content to that grid.

The idea is to abstract the grid from the content, a separation of concerns, so that itā€™d make it more portable if needed. Jeet getā€™s rid of the need for the grid div elements as itā€™s in the CSS (Sass) which Iā€™d suggest is a lot easier to edit than picking through various divs with grid classes added to it for responsive web design.

Obviously there are two trains of thought here in regards to using a grid system within your markup or within your CSS. I, personally, prefer to add it to the CSS, like Jeet does.

Iā€™m happy with conflicting views, if your ā€˜brainfartā€™ comes to something perhaps pitch an article to SitePoint? :slight_smile:

Ah ok I understand what you are trying to say now. I understand that.

I think the article does a poor job of explaining this (actually I donā€™t think they explain that at all) so thanks for the help on that.

I do understand the usefulness (albeit Iā€™m not sure how OFTEN this would come up? Iā€™ve managed everything so far without the need for this but I can imagine situations which this would have been useful) that Jeet is offering here. Thanks!

I wasnā€™t trying to insinuate I had conflicting views. Merely stating that I failed to see the authors point (again, because no explanation was given so I was left to imagination.) I actually do see your point and agree there are cases where this is useful.

1 Like

I pitched an article to them (just an idea; I didnā€™t say Iā€™d write it) over 3 weeks ago, even sent Sitepoint a message on FB, and the survey that Sitepoint gave out, I EVEN sent it in there (with also a request to check their e-mail)) but STILL no one has responded. Iā€™m a bit offended/shocked that no one appears to be checking their e-mail; or at the very least I didnā€™t get a response.

It wasnā€™t a ground breaking article anyway; just something that I saw the internet lacked on.

Off-Topic
Assuming you did
http://www.sitepoint.com/writing-guidelines/
@Ophelie should be able to help

Jeet is more like susy or neat than a framework.
It is a mixin library that makes it easier to create the grid you want.

If you need a simple grid bootstrap and foundation are fine, and if you want more control you use a mixin library like jeet.

Hi Ryan,

Thanks for taking the time to read the article. The advantage of Jeet is its flexibility. Frameworks such as Bootstrap and Foundation require extra markup (div) that can be difficult to maintain. Of course, you can make your code more efficient if you customize them. On the other hand, Jeet doesnā€™t need any additional div or customization. All you have to do is to define a class name and then apply the mixins you want to it. So, the complexity is in CSS which is handled by mixins.

Hey Ryan ā€” which address did you send your pitch to? I havenā€™t gone through all survey results yet (there are a lot), but if youā€™re still interested, you can pitch an article directly to me via PM here, or to @Adam, or to one of the SitePoint editors (like @sturobson or @louislazaris).

1 Like

Thanks, Stuart got in touch directly. And it turns out that it was 11/17/14 that I originally sent the e-mail so itā€™s beyond 2 months; not 3 weeks like I thought :stuck_out_tongue: .

I had e-mailed an undisclosed e-mail (donā€™t want to say who I sent it to publicly) but I only pitched an idea; didnā€™t want to actually write it myself. Those who have read my own website articles probably are frustrated at my writing :slight_smile: .

Back to the topic at handā€¦

@georgemarts, I am able now to see what flexibility this offers. It saves some of the ground work that youā€™d have to otherwise do. I can appreciate how this will be useful. Thanks for the great article (although Iā€™m holding true that I think it should have been explained better; but Iā€™m just a disgruntled person since I didnā€™t get it right away; thatā€™s my own fault)

Keep up the good work.

@Ophelie Stuart (in this thread) messaged me and I talked to him. If you really want to know who I sent it to, then you can follow up with him. I donā€™t want the person to get in any trouble.

I prefer use susy, i think susy has more to offer and susy has the direction rtl or ltr feature.

Agreed. This doesnā€™t really seem like anything new to me. I wrote a ā€œgrid on demandā€ like this some time ago called Ignition and popped it on GitHub, although I donā€™t manage to do much development in anger any more to actually use it. Susy is great, too.

However, having more people work on tools like this is generally a good thing - It gives developers more choice, and can lead to better ways being found to deal with the obstacles we face every day.

This compatible with LibSass or only the Sass gem?

I havenā€™t yet tried it, but it seems that Jeet is also compatible with LibSass according to this.

Great article - thanks for explaining Jeet. The use of fractions could help solve a few design problems.Thereā€™s a misconception about Bootstrap mixins though.

Bootstrap comes with mixins such as .make-row(); and .make-sm-column(6);, as well as .make-sm-column(6,0); to remove padding from column declarations. Declare those at the correct breakpoints and you donā€™t need to declare col-sm-6 in your HTML.

Thanks for sharing that tip :smile: !

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.