css - Html elements positioned as relative, then moved -15px still take up same physical space -


I have a series of tabs on one page tabs set to relative position. Then they left 15px on the left, the resultant style looks like this:

  style = "position: relative; left: -15px"  

( Note that each tab has to be left -15 * tab number - then # 2 will be -15, # 3 -30, etc.)

This tab gives a good overlapping experience, which wants However, the downside is that when the original width of the tab (without the left step) is used in the middle of the table, the result is that in Think omitted-Sidd.

Is there no way to behave this way?

& lt; Li & gt; With 's: Relative', you can apply it to each tab (except for the first tab):

  Margin-left: -15px;  

Edit: Example of concept ...

  & lt; Div style = "text-align: center;" & Gt; & Lt; Img src = "http://www.google.com/intl/en_ALL/images/logo.gif" /> & Lt; Img style = "margin-left: -54px;" Src = "http://www.google.com/intl/en_ALL/images/logo.gif" /> & Lt; Img style = "margin-left: -54px;" Src = "http://www.google.com/intl/en_ALL/images/logo.gif" /> & Lt; Img style = "margin-left: -54px;" Src = "http://www.google.com/intl/en_ALL/images/logo.gif" /> & Lt; / Div & gt;  

Comments