Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

From Bootstrap to CSS Grid

open.nytimes.com

Post reply on HN
Print view View original

81–90 of 104 posts

Re: From Bootstrap to CSS Grid

#81

Post by chiefalchemist »

ty___ler wrote: post #51

My breakthrough moment for grid UI development was realizing that all of my layout code for a component is contained in the parent – rather than spread around the children. For example, in bootstrap or some other older layout framework every "column" would need to contain some class or id to style it correctly. So for a 3 column grid you would need to give each element a class setup of something like "column-third".…

And it makes sense. That is define the properties of the container, not the individual items within it.

Re: From Bootstrap to CSS Grid

#82

Post by tnolet »

stephenboyd wrote: post #59
michaelbuckbee wrote: post #24

Earlier quoted context omitted.

What I think goes unrecognized in the design community is what a tremendous skill it is to be able to put together really disparately styled and designed UX elements into a cohesive whole. Pre Bootstrap / Material / whatever - I'd end up with designs that were just incoherent. You'd look at a modal, or a file upload or something and none of them individually were that awful, but as a whole they didn't fit together.

How often can you use Bootstrap components unaltered? I'm either working on things where aesthetics are important enough that I'd have to write custom CSS for every component, or where aesthetics are so unimportant that stylistic coherence is irrelevant. When I use things like Bootstrap it's as a scaffolding in the early stages of development before I write enough of my own CSS. Eventually then I've restyled all the…

Overriding Bootstrap variables gets you 80% there. You can do a lot with changing padding, colors and fonts. I was very sceptical of Bootstrap from a design perspective but changed my mind after some deep diving into customization.

Re: From Bootstrap to CSS Grid

#83

Post by tnolet »

drb91 wrote: post #53
tnolet wrote: post #17

Earlier quoted context omitted.

Not arguing the usefulness of CSS Grid, but Bootstrap is a whole bunch more than just a grid. All the components in Bootstrap kinda work together with the .container .row .col classes and that’s still a crazy useful feature.

> All the components in Bootstrap kinda work together with the .container .row .col classes and that’s still a crazy useful feature. Actually, this has come to be the part of bootstrap I like the least. Individually the components are extremely useful, but as a layout engine I've constantly struggled to get it to comply with anything but layouts that look a lot like the ones in the bootstrap examples. CSS Grid and fl…

I feel the extra padding and margin classes like mb-3, px-md-5 make up for a lot of the rigidity that the .container .row .col system insists on. Not perfect, but a whole lot better than anything I could come up with for a medium to large web app.

Re: From Bootstrap to CSS Grid

#84

Post by tnolet »

Bizarro wrote: post #45
tnolet wrote: post #17

Earlier quoted context omitted.

Not arguing the usefulness of CSS Grid, but Bootstrap is a whole bunch more than just a grid. All the components in Bootstrap kinda work together with the .container .row .col classes and that’s still a crazy useful feature.

The thing about Bootstrap (at least v3) is that the component library is pretty bare bones. But I'm curious to your statement about "working together". Are Bootstrap components "aware" of the layout css/components?

Working together as in consistent styling. Margins, padding, font sizes etc. are consistent and scale when you use their xs, sm, md and lg formats...up to a degree.

Re: From Bootstrap to CSS Grid

#85

Post by rmrfrmrf »

tannhaeuser wrote: post #66
mhink wrote: post #25

Earlier quoted context omitted.

Because Web browsers originally operated under a document-focused paradigm rather than an application-focused paradigm. (The CSS box model spec makes much more sense if you dig through it with this in mind.) Even after Javascript came out, there wasn't really a notion of a Web application in the modern sense- if you wanted to deliver rich content, the primary way to do it was via Flash or Java applets. I would hazard…

The question is why it was deemed necessary to morph the document-centric Web into a Frankenplatform, and for what price. The complexity of CSS has already driven Opera (who once employed the original inventor of CSS) out of the business of producing a web renderer.

It’s a de facto platform driven by 3.5 billion users. No one “deemed” anything necessary, it just became. And it wasn’t for lack of trying, either (see Java, Adobe AIR, et. al.).

Re: From Bootstrap to CSS Grid

#86

Post by rmrfrmrf »

thomascgalvin wrote: post #19
disconnected wrote: post #13

It's about time the web got a decent layout system. Every UI toolkit that I know of (wxWidgets, Tcl/Tk, Qt) has some form of layout mechanism (box layout, grid layout, etc), and they'd had it for years/decades. On the web though, people have been hacking around this omission for ages with tables and assorted "grid" systems (pure css, bootstrap, etc). The needs for layout management was there for as long as I can reme…

Web development is just starting to catch up to where we were fifteen years ago. Things like type safety, unit testing, and dependency management are still fairly new on the Javascript side of the house, and I'd argue that Maven is lightyears ahead of NPM or pack or gulp or whatever the fuck the kids are using these days. The UI side is even worse. When you compare $todays_web_framework to QT or Swing, it's like drop…

> I'd argue that Maven is lightyears ahead of NPM or pack or gulp or whatever the fuck the kids are using these days.

Would you? You think a build system that’s so pointlessly convoluted and verbose that you’re literally encouraged to resort to copy-pasting blocks of XML and using fucking Eclipse to accomplish even the most basic tasks is somehow superior to package.json or Gulpfile.js setups?

Re: From Bootstrap to CSS Grid

#87

Post by gregmac »

tnolet wrote: post #17
mrborgen wrote: post #4

"It took about three lines of CSS to write the grid layout I wanted, and I wanted to live in the bright and beautiful future where layout is always that simple." This is so spot on. I've met many developers who tend to think Bootstrap is easier, but that's usually because they haven't experienced this part of CSS Grid. Just add a couple of lines and you have a very powerful grid layout. I wrote an article on Bootstra…

Not arguing the usefulness of CSS Grid, but Bootstrap is a whole bunch more than just a grid. All the components in Bootstrap kinda work together with the .container .row .col classes and that’s still a crazy useful feature.

One of the compelling things for me is the ecosystem of bootstrap-based "themes". As a developer with enough design sense to realize I can't do design, I love I can work with a simple markup format and more or less drop in a theme to get a decent look, without having to think a lot about design or have an actual designer. For the internal tooling I primarly work on, bootstrap has meant a vastly improved look and feel over what I would have done before.

From this perspective, Bootstrap is basically an API you can develop against.

For customer-facing products and websites (where you can have actual designers involved) it's maybe not as compelling, or even a negative ("oh look, a bootstrap site"), but it's fundamentally not a worse choice than any other framework or programming language.

Re: From Bootstrap to CSS Grid

#88

Post by freeone3000 »

gregmac wrote: post #87
tnolet wrote: post #17

Earlier quoted context omitted.

Not arguing the usefulness of CSS Grid, but Bootstrap is a whole bunch more than just a grid. All the components in Bootstrap kinda work together with the .container .row .col classes and that’s still a crazy useful feature.

One of the compelling things for me is the ecosystem of bootstrap-based "themes". As a developer with enough design sense to realize I can't do design, I love I can work with a simple markup format and more or less drop in a theme to get a decent look, without having to think a lot about design or have an actual designer. For the internal tooling I primarly work on, bootstrap has meant a vastly improved look and feel…

would it be possible to use bootstrap-themed components with css grid? It appears you don't have to use bootstrap positioning to use bootstrap theming.

Re: From Bootstrap to CSS Grid

#89

Post by cjalmeida »

brucephillips wrote: post #71
thomascgalvin wrote: post #19

Earlier quoted context omitted.

Web development is just starting to catch up to where we were fifteen years ago. Things like type safety, unit testing, and dependency management are still fairly new on the Javascript side of the house, and I'd argue that Maven is lightyears ahead of NPM or pack or gulp or whatever the fuck the kids are using these days. The UI side is even worse. When you compare $todays_web_framework to QT or Swing, it's like drop…

Interesting. What's a specific example of how QT or swing is superior to web tech?

It is not, at least in 2017. Qt5 is great, specially with QrQuick, but you need to commit to C++ and that's a problem in itself. (No, the Python binding are unholy with restrictive license and poor docs)

Swing is on a whole other level of verbosity. For anything more complex, you actually need a GUI editor.

Need an actually good looking set of widgets or even simple customizations? You have way less options than what's available in CSS and have to resort to Graphics2d drawing.

And Maven sucks, use Gradle instead.

Post reply on HN