Bill, I came up with a version that uses no images at all, and I believe, does what you want it to do.
You could expand on it a bit, and give it highlights at the top and left as well. Or, make the shading and highlights fuzzier by adding more "inner divs". Have a look: http://www.rodenhofer.com/3DBoxTest/ Kevin Erik Vorhes wrote: > On Tue, Sep 22, 2009 at 8:54 AM, bill walton <bwalton...@gmail.com> wrote: > >> The panel in the middle behind the signup form is actually two images: >> an 11px-wide one on the left that gets repeated, and an 11px one on the >> right that finishes the image off. The visual intent is shading on the >> bottom and right edges of the panel for a 3D effect. >> >> The problem is that the image on the right is not expanding to the same >> height as the one on the left. >> > > > A possible solution: > > HTML: > <div id="outer"> > <div id="inner"> > ... > </div> > </div> > > CSS: > #outer { > background: url(right-edge.png) no-repeat bottom right; > margin: 0; > padding: 0; > padding-right: [width of right-edge.png]px; > } > #inner { > background: url(bottom.png) repeat-x bottom left; > margin: 0; > padding 0; > } > > > As long as you never give #inner padding-right & never give #outer > padding-bottom, you should be OK. > > If you float any children of #inner, make sure to add overflow:hidden to > #inner. > > Erik > > PS This hasn't been tested in IE6, so you might need to force > hasLayout for it to work. (Give each of those divs zoom:1 and you > should be fine.) > ______________________________________________________________________ > css-discuss [cs...@lists.css-discuss.org] > http://www.css-discuss.org/mailman/listinfo/css-d > List wiki/FAQ -- http://css-discuss.incutio.com/ > List policies -- http://css-discuss.org/policies.html > Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ > > > ______________________________________________________________________ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
