Tabs Extending Beyond Content

[Pixel-Industry]

A recent, possibly fading, trend in design is to have little tabs or buttons extend beyond the content as seen in the picture above. As far as coding this what is the best technique?

A. Extending the container div wider and use margins to push content further over

or

B. Use position: absolute; to extend the tab beyond that container...

Also, what is the most effective and compliant way to achieve vertical text as seen in the above picture?

 

[DylanButler]

1. B. Use position:absolute and then javascript to hide it when the user's browser is not wide enough to achieve consistent horizontal scrollbars in all browsers.

2. Use transform:rotate. See Text Rotation with CSS - Snook.ca.