W3C home > Mailing lists > Public > www-style@w3.org > August 2009

Re: Shadows vs. layout

From: Anton Prowse <prowse@moonhenge.net>
Date: Tue, 04 Aug 2009 22:20:16 +0200
Message-ID: <4A789800.1050102@moonhenge.net>
To: www-style@w3.org
Tab Atkins Jr. wrote:
> On Tue, Aug 4, 2009 at 1:23 PM, fantasai<fantasai.lists@inkedblade.net> wrote:
>> Brad Kemper wrote:
>>> Also, suppose my BODY element has 16px of padding and no margin or border.
>>> Now I put a 32px wide border-image around it with a 32px offset. In that
>>> case, I would expect the border-image to be clipped on all four sides
>>> (or at least three). If it was clipped on the left and top but scrollable
>>> to the right and bottom, that would just be weird.
>> Why would you do something like that?
> One example from some recent projects: a fixed-width site designed to
> be usable in 800x600, which maximizes the size of the 'content column'
> to fit as much as possible into an 800px wide screen, but also
> provides some non-essential decoration around the edges to make it
> look less sparse on wider screens.  This decoration should overflow on
> an 800px-wide screen, but shouldn't trigger scrolling.
> Right now that can be hacked into place by putting a centered
> background on <body> and all content within a centered container
> element.  That only works if your image is okay to be infinitely
> vertically tiled, and still is a little tricky to get pixel-perfect.

I second that this visual effect is desirable sometimes.  (There is also 
another way to achieve such width-dependent clipping, involving negative 
margins, which allows you to attach the shadow/pattern as a background 
of the column itself rather than rely on superimposing the column over 
some other box which holds the shadow/pattern.[1])

Although the CSS2.1 used is semantically "correct" in both those 
approaches (and to my mind more pleasing in the former), it's clear that 
border shadow is an even more appropriate way of doing this.

I'm not sure if this argument is particularly forceful though.  If there 
were no clipping, I'd just make sure to increase the margin area to be 
at least as large as the shadow area.

[1] http://dev.moonhenge.net/css21/techniques/width-dependent-clipping/

Anton Prowse
Received on Tuesday, 4 August 2009 20:21:58 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:07:38 UTC