[thelist] CSS background positioning and link borders

Gregory Wostrel info at gwcreative.com
Tue Feb 24 12:34:00 CST 2004


On Feb 24, 2004, at 9:47 AM, Stephen Caudill wrote:

> 1. removing "fixed" from the .sidebar class keeps it relative to
> the column, not the view port.  I got closer results to what you
> were looking for also, by exchanging "right" for "left" in the same
> class.  This is what my rule looked like:
> .sidebar { background: #ccc url(swoosh-background.gif) no-repeat right 
> bottom; }

after fussing with this a little bit (what you suggested worked pretty 
well and the "fixed" thing was what was giving me a fit and I didn't 
realize it) I realized that fixing it to the viewport really was what I 
wanted to do. So I redid the graphic and did this:
http://www.gwcreative.com/working/pt/index.html
The swoopy bit shows more, even with a small browser window and it 
stays in place. It seems to work out pretty well on IE/PC as well 
except that IE6 incorrectly (I think) fixes the graphic to the column 
and not the viewport. My client is on a Mac/OSX, as I am, so it helps 
that it works fine in Safari, too.

But then I started to play with it a bit and did this:
http://www.gwcreative.com/working/pt/index02.html
which makes the swoopy bit much more prominent and it mimics some of 
the design on the company's letterhead - good deal. But what a mess in 
IE/PC. Rather than fixing to the viewport with the same relationship so 
that the graphic appears seamless, it is a real mess.
Screenshot for those without 
PCs:http://www.gwcreative.com/working/pt/IE6_PC.gif

It works OK in mozilla (Firefox) except on the PC the entire sidebar 
goes missing! Sheesh!
Can't do anything fun.

Gregory Wostrel

gwcreative
http://www.gwcreative.com/
gw at gwcreative.com
401.286.9228
Communications and the Art of Simplicity



More information about the thelist mailing list