> Hi Austin, > > What is the purpose of putting the position of the a logo span to > -9999px? I am still a newbie, so am learning.
It's a basic way of replacing text with background images. See <http://css-discuss.incutio.com/?page=ImageReplacement> for more info. That takes the text "off screen" so that it doesn't go over the top of the image. It also means that when css is turned off there is still the info on the page, (and no image). > > Anahita > > > ----- Original Message ---- > From: Austin Harris <[EMAIL PROTECTED]> > To: css-d <css-d@lists.css-discuss.org> > Sent: Friday, April 20, 2007 11:52:52 AM > Subject: Re: [css-d] Links on background images > > > Come in a bit late on this lot but I would go for something like this, > (untested but you get the idea); > > html; > > <a class="logo" href="link"><span>Whatever is written in the > logo</span></a> > > css; > > a.logo { > display: block; > width: width of image; > height: height of image; > background: url("url to image") no-repeat; > } > > a.logo span { > position: absolute; > top: -9999px; > left: -9999px; > } > > > > That way you get the text version as well as the image and the link! > > Austin > > ----- "Barney Carroll" <[EMAIL PROTECTED]> wrote: > > Austin, Darrel wrote: > > >> Darrel, create an <a id="logo"> with the desired link in the > > >> element that has the background, and give the following CSS: > > > > > > FYI, Anahita is the one asking. That said, while your solution > > would > > > work, you're left with an empty link (which is neither semantic > nor > > > terribly accessible). Again, if you want the logo to be a link, > > then > > > the logo should be part of the page content. You could do > something > > > like this: > > > > Sorry Darrel. Lazy email reading. > > > > Anahita, I assume your <a> would have an href and a title (only > I've > > no > > idea what they would be). I would also close it off. I wasn't > honestly > > > > suggesting just dumping <a id="logo"> into the code by itself. > > > > Moving the span isn't a bad idea, however if you're doing this out > of > > > > concern for non-visual browsing, the title tag can do this part of > the > > work. > > > > > > Regards, > > Barney > > > ______________________________________________________________________ > > css-discuss [EMAIL PROTECTED] > > http://www.css-discuss.org/mailman/listinfo/css-d > > IE7 information -- http://css-discuss.incutio.com/?page=IE7 > > List wiki/FAQ -- http://css-discuss.incutio.com/ > > Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ > > ______________________________________________________________________ > css-discuss [EMAIL PROTECTED] > http://www.css-discuss.org/mailman/listinfo/css-d > IE7 information -- http://css-discuss.incutio.com/?page=IE7 > List wiki/FAQ -- http://css-discuss.incutio.com/ > Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ > ______________________________________________________________________ > css-discuss [EMAIL PROTECTED] > http://www.css-discuss.org/mailman/listinfo/css-d > IE7 information -- http://css-discuss.incutio.com/?page=IE7 > List wiki/FAQ -- http://css-discuss.incutio.com/ > Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
