grid system feedback

[__]

Thanks!
Those all look pretty much like it does everywhere else I’ve checked. Did you notice anything specifically different across browsers?

mobile first first pass. I tried the inline-block thing but it failed hard for nested columns

[chrisburton]

The only thing I noticed right away were the margins between Chrome and Safari (OS X Yosemite). Should I have used that other link for screenshots?

[__]

Found the first bug. Well, it’s not a bug, really, but it’s a problem. Spec says position:relative is meaningless on table-ish elements, so my rows and columns cannot reliably create a positioning context as intended.

(Also a weird thing happens just below the breakpoint: the .wrap stops filling the whole height of the [at-grid-row] for a while).

I can solve the breakpoint issue by making the rows block below the breakpoint. I may just live with the positioning context issue. Things that need it typically already have their own wrapper…

[__]

The only thing I noticed right away were the margins between Chrome and Safari (OS X Yosemite).

extra margin, but only on the right side, in Chrome? is that what you’re seeing? is there something more? For that pen, I was mainly interested in any differences inside the dotted borders.

Did you notice anything “off” on the second (or third) pen?

[chrisburton]

Ok so after taking a second look, Chrome and Safari (Mac) look the same for both versions (grid and mobile first first pass). Initially I must have had one browser not as wide as the other. Everything inside the dotted borders are mirrored.

Did you notice anything “off” on the second (or third) pen?

Wait. Was the third pen the “mobile first first pass” link?

[__]

Yes. The three pens (so far) are:

1. quick/dirty example
2. sample layout
3. mobile-first sample layout

[__]

Current state. Think I fixed the breakpoint oddities.

I think I’m going to ignore the position:relative issue. Yes, it creates an edge case, but I think it will have little to no impact under planned usage. I’m writing a full demo page, which will describe usage patterns. Should be up tomorrow.

[Alen]

@traq, post it already. I’m at jury duty. Need something to read.

[__]

Sorry @AlenAbdula, didn’t realize demand was that high! I’ve been running errands this morning. Waiting for github pages to get set up now.

Hope your day wasn’t too bad. I know it’s late, but I’ll have something for you to read soon.

[Alen]

No worries ;)

Take your time.

[__]

Okay, sorry for the wait: demo page

There’s a fix I need to make for the second demo. It’ll be done soon. Enjoy, and I’m still interested in feedback on consistency across browsers (esp. IE9). Thanks!

[Ilan Firsov]

IE9 Windows 7 – all hell breaks loose
http://imgur.com/a/n4Sng

On Chrome everything looks perfectly fine

[Ilan Firsov]

Sorry I did not try the pens and the next time I’ll be near a computer with ie9 is next week.
I can try the emulator thingy in ie11 but from past experience it doesn’t work really well

[__]

That’s okay.

And yes, I really am looking for “actual” IE9. Thanks again!

[__]

I’m not giving up, but going back to my original version, which used inline-block. I think they both have advantages.

[Author]

Posts