Francky....it works perfectly. You went through enough trouble to
help me out that I have to say (Thank-you * 1000)! After reading
your reworking of the css i now completely understand how to do this
the proper way. And you are correct, the offsetting is much easier
with the graphics in a horizontal manner. Again, thanks so much!
On 23-Jun-06, at 8:27 AM, francky wrote:
> rollandburn wrote:
>
>> Hi all, I wonder if a guru could help me out with my (attempted)
>> implementation of sprites and image replacement. Below is the
>> css and html which works fine in firefox and internet explorer
>> (as far as I can tell) and an example can be seen at http://
>> www.rollandburn.com
>>
>> I get the feeling I'm missing something important with the
>> sprites because there should be no need to keep repeating...
>>
>> background: url(linkGrid_sectionTabs.gif) -240px -15px no-repeat;
>>
>> ...in the css for each of the tabs. I thought I could simply
>> put that under the #tabNav li {} and for each of the tabs all I
>> would have to set is the positioning but unfortunately the way I
>> have it below is the only way I could get it to work.
>>
>> Arg!
>> I know my IR technique probably leaves a lot to be desired. =[
>> Thanks for any suggestions or advice to improve. =]
>> [...]
>>
> Hi Rollandburn,
> If you use an image with the tabs horizontally, everything is more
> simple to see. First put the image as a general background (all
> grey), then lift the one you need when hovering. Same way (lifting
> 1 step more) for the current status of a tab. The positioning of
> the tabs can be done with floating left for each tab.
> Compare: test page here <http://home.tiscali.nl/developerscorner/
> css-discuss/test-rolland.htm>.
> :-)
>
> Greetings,
> francky
>
> btw: Consider a larger font size for the tab images (pretty small
> at large resolutions...), or (better) use text with a tab-bg of
> only the sprite; then the visitor can scale the font size, if
> wanted/needed. Accessible for everybody!
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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/
