Is There Anything You Wish CSS Could Do? 15 Designer/Developers Sound Off
* October 10th, 2008 *
Wolfgang Bartelme
Designer at Bartelme Design
I’d love to see cross-browser support for gradients, shadows, opacity masks and rounded corners. I guess that would not just dramatically reduce bandwidth, but also speed up production and customization.
Jon Hicks
Designer at hicksdesign
I would love a different box model! I find it bizarre that padding and border add the width of an object, and would love to be able to give something like a textarea 100% width and 3px padding without worrying what it’s going to do the layout. Perhaps something like padding-inside as a new selector?
In that vain I also wish I could specify a 100% width for an element, minus a set fixed width. Again, very useful when creating fluid designs with form elements!
Andy Budd
Author and Web Standards Pioneer: AndyBudd.com
Most of the stuff I want is in CSS3, so what I actually want is the core modules finished and implemented fully by at least two browser vendors.
David Walsh
Web Development Blogger: David Walsh Blog
I think that the lack of font abilities that we’ve been living with is a sin. Our other options for using non-standard web fonts, sIFR and utilizing images, are painful and have really held the creativity of the web back. I also believe that standard corner-rounding properties must be added — we’re all tired of creating rounded-corner images and browser-specific hacks to achieve our goals. Lastly, I wish CSS would be implemented in browsers faster. We’ve had little advancement in the past few years.
Collis Ta’eed
Entrepreneur, Blogger, Designer at Envato, Home
The biggest problem I have with my CSS is that with large sites it gets very unwieldy. On a site like FlashDen the CSS goes on for miles, and then I have a second set of sheets to apply to change all the styles for people visiting alternate versions of the site (ThemeForest or AudioJungle). Even with the best intentions, it’s pretty messy.
I wish that I could have an inheritance concept in CSS like you have in object oriented programming. So you could go:
.button { /* some styles */ } .button >> .sidebar_button { /* inherits all of .button and adds new styles */ }I know that currently I could just define it like this:
.button, .sidebar_button { /* some styles */ } .sidebar_button { /* inherits all of .button and adds new styles */ }But somehow that doesn’t seem like an elegant way to do things. And if the first and second definitions happen to be separated by a large block of other CSS code, when you come back to read your CSS later, there is no way for you to know that .sidebar_button has some more styles attached to it. Whereas the inheritance version above, you can read that it’s a derivative of .button.
Keith Robinson
Creative Director at Blue Flavor, Home
I wish CSS could handle embedded fonts in the manner we use sIFR now.
Shaun Inman
Designer/Developer of Mint, Home
Here’s the thing, one more half-baked, tacked-on stopgap isn’t going to improve CSS in any meaningful way–it would only compound a fundamental flaw in its design. CSS feels like a style sheet implementation you’d find in a late 90’s desktop publishing app. It’s still very text-centric. Style sheets just weren’t designed for creating complex layouts. CSS’s layout features are tacked on–and 10 years later it definitely shows.
I’d love to see the CSS Text Module rewritten by experienced typographers and typesetters and the CSS Layout Module rewritten by experienced publication designers, both traditional and newfangled.
And sometime before 2022 if at all possible.
Jeffrey Jordan Way
Editor at NETTUTS and ThemeForest Blog, Home
I wish we could assign variables in our stylesheets. For example, it would be nice if, rather than having to scroll to the top of my document every time I needed to grab the hex value for my chosen “blue”, I could simply assign that value to a variable called “myBlue”.
var myBlue = #191955; #someElement{ color: myBlue; }This is a topic that has been debated to death, and truthfully, it might prove to be a bad idea. I’m still not sure. I could swing either way in such a discussion. Once you open that door, you sort of lose the whole concept of CSS. But, I think if done responsibly, variable assigning could potentially save us a great deal of time when designing.
Steven Vandelay
Designer at Vandelay Design
One of the great things about working with CSS is that there’s usually different ways to approach something that you’re trying to accomplish, but in some ways I would like to see more standardization when it comes to layouts.
Andy Clarke
Author, Designer, and Developer: Stuff and Nonsense
Well, aside from the obvious (making sure that Obama gets elected, making me very rich and making me a cup of nice tea) what I would like most from CSS are better layout tools to allow me to create rich, intricate designs without the need to add presentational elements into my markup. The CSS Working Group (of which I am a former member) have been working hard on these layout tools. I hope that before too long we will see the browser makers implementing these proposals (using -browser- extensions) so that designers and developers can experiment with them.
Chris Spooner
Designer at SpoonGraphics, Home
Multiple Backgrounds, Rounded Corners, Border Images and Opacity are my first thoughts when asked what I wish CSS could do, then I remember - these are all in the pipeline for CSS3! In this case, my dreams are coming true in terms of CSS, which makes the question; Is there anything you wish Browsers could do?!
One CSS technique I wish there was a shorter technique for would be to easily make a two or three column layout with equal height sidebars without the use of the faux column method.
Elliot Jay Stocks
Designer, Writer and Speaker, Home
I’d like to see conditionals natively supported in CSS without the need for workarounds such as (the excellent) Conditional-CSS. Many people argue that browser detection is essentially something that should be handled outside of a stylesheet, but all of the HTML-based conditional comments I use to handle IE-specific code is entirely to call in ‘hack’ CSS files. The implementation of code along the lines of what we use to target Gecko- or WebKit-based browsers would be a hugely welcome addition for me.
Nick La
Designer - Web Designer Wall, N.Design Studio
I wish CSS could do layer styles like Photoshop where you can add: inner shadow, outer glow, bevel effects, etc. It would be even better if we could have layer blending mode.
Jesse Bennett-Chamberlain
Designer at 31Three
The only thing that comes to mind would be variables. I don’t get my hands too dirty with code very much any more, but variables would be quite handy for when I do. Ask me what I would like Photoshop to do and I could give you a much longer answer
Volkan Görgülü
Designer / Developer - Web Deneyimleri
I wish instead of writing
#sample h1, #sample h2, #sample h3 —> (long and ugly)
something like this
#sample [h1, h2, h3] —> (short and clean)
would do the job
Another example can be
#sample a:link, #sample a:visited
#sample a [link, visited]
Loading ...
Re: John Hicks’ request for a different box model: You can switch the box model using the box-sizing property from CSS3. It’s supported directly by some browsers, via prefixed/namespaced properties in others, and you can even add support in IE6 via Dean Edwards’ IE7.js:
box-sizing: border-box | content-box;
The browser-specific variations are -moz-box-sizing, -ms-box-sizing, and -webkit-box-sizing.
More info here:
http://www.quirksmode.org/css/box.html
jason