Hacker News Reader

Comment by baddox | Hacker News Reader

Literally the only problem with CSS itself is that it doesn't have defines. Every other problem is just browser implementations.

View on HN

I also have issues with the "box model." Judging by the popularity of grid layout systems like blueprint and 960 I think others also do.

The box model is fine when you just need to "flow" things around things, like text around images, and typical blog designs, but when you develop complicated interfaces it really shows its limitations and costs many hours of frustrating effort.

Not sure if this is what you're referring to, but you can have a box model that includes padding and border in the width using CSS3:

  box-sizing: border-box

with -ms- (IE8), -moz- and -webkit- prefixes.

http://www.quirksmode.org/css/box.html

http://www.w3.org/TR/css3-box/

Right CSS version, wrong module: http://www.w3.org/TR/css3-ui/#box-sizing

The CSS3 UI module is a candidate recommendation. Setting:

box-sizing: border-box;

essentially puts the CSS box model render mode to where it was in IE5 (which is, frankly, the only sensible way to do it). Right now, it is available with Mozilla, Webkit and Microsoft prefixes (as are most of the UI module properties).

Isn't CSS3 supposed to fix that or at least give us another option? I should have specified that I was referring to CSS3.

Literally? I don't think so.

CSS has very weak layout capabilities.

CSS has weak typography.

CSS has weak colour system support.

In each case, this is partly due to limitations in the underlying model, but also partly due to having limited syntax.

In each case CSS3 modules may improve things somewhat if and when they are widely supported, but even the best proposals there aren't even close to the power of a good DTP tool or the control of a native application. When the web is trying to take over from both, CSS isn't a good tool, it's just the best we've got right now.

There are plenty of problems with CSS. You can't specify the width of an inline element, for one. That alone prevents a lot of reasonable layouts, like tables. Also problematic is a standards body that ignores this use case! In this case, they protect the writer from over-filling some boxes with more boxes. But that would at least be visible - in this case, the workarounds end up far worse.

If you want a table layout, why not just use a table? Or you can use display: inline-block if you want to give a width to an inline element.

I run into plenty of situations where I have multiple lines, and I'd like the respective elements to align. It's not limited to tabular data, but it's the easiest example

Tables FTW. It's the HTML element for controlling horizontal and vertical relationships at the same time.

> You can't specify the width of an inline element, for one.

  display: inline-block;
  width: ...

?

Unfortunately, bad browser support :/

http://www.quirksmode.org/css/display.html

That was primarily in the context of "Also problematic is a standards body that ignores this use case!" part of your comment.

Besides if you don't care about antiquated browsers (eg IE6), the inline-block is a viable option. In IE it will require some massaging, but it can be made to work quite easily.

The lack of a proper layout system causes a huge number of problems, and is the reason the "tables vs. css" argument can still occasionally pop up. The nuts box model has already been mentioned.

I agree for the most part, but as the "only" problem, it's a seriously gigantic one. CSS is cool but this limitation is so frustrating, especially once your style sheets start getting really big.

Reply on news.ycombinator.com