I am finding numerous CSS tutorials that are great for overlapping tabs but none of them are with various widths for each tab. Is it even possible to have the width change based on the size of title?
Here are 3 tabs as examples of how they vary.
About Us | Auto Glass For Your Vehicle | Emergency & Business Glass Services
Note: The graphic for the tab has shading and will be PNG 24 of course so that it will overlap but I can't imagine how to change width.
Would there be part of the graphic doing a repeat-x? If so, how would you put the end caps and still be based on active tab?
EDIT: Here is a link showing how each tab is SAME length with a static image for the tab. I need to figure out how to do the exact same thing but with middle part of tab ability to "grow" in width depending on title of the tab: http://code-pal.com/examples/how-to-code-an-overlapped-menu/
I think this tutorial will really help you out. It does overlapping tabs with variable widths exactly like you're asking. It doesn't appear to be infinitely wide, but you just have to adjust the length of the longer sides to be longer than they will need to be.