Witam.
Problem pewnie dość prosty, ale jakoś nie mogę sobie poradzić więc pytam:

Może zacznę od kodu:

[PHP] pobierz, plaintext 
<style>
  DIV.test
  {
    width: 165px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    z-index: 1;
  }
 
  DIV.test:hover
  {
    white-space: normal;
    background-color: #363636;
    border: 1px #505050 solid;
    padding: 3px;
    z-index: 2;
  }
</style>
 
<div style="height: 20px;"><div class="test">sdf sf sdf sdf jsdlfj sdlkjflsdkj flsdkjflk sdjflsdj lfjsdlk jfsldkj flsdkjf lskdjflksdj fs</div></div>
<div style="height: 20px;"><div class="test">sdf sf sdf sdf jsdlfj sdlkjflsdkj flsdkjflk sdjflsdj lfjsdlk jfsldkj flsdkjf lskdjflksdj fs</div></div>
<div style="height: 20px;"><div class="test">sdf sf sdf sdf jsdlfj sdlkjflsdkj flsdkjflk sdjflsdj lfjsdlk jfsldkj flsdkjf lskdjflksdj fs</div></div>
<div style="height: 20px;"><div class="test">sdf sf sdf sdf jsdlfj sdlkjflsdkj flsdkjflk sdjflsdj lfjsdlk jfsldkj flsdkjf lskdjflksdj fs</div></div>
<div style="height: 20px;"><div class="test">sdf sf sdf sdf jsdlfj sdlkjflsdkj flsdkjflk sdjflsdj lfjsdlk jfsldkj flsdkjf lskdjflksdj fs</div></div>
[PHP] pobierz, plaintext 

Chodzi o to, że mam kilka divów. Mają one stała szerokość oraz ustawione atrybuty w ten sposób aby przycinały za długi tekst, natomiast po najechaniu kursorem wyświetlały całość rozszerzając diva w pionie.
Problem polega na tym, że rozszerzony div nie zasłania poniższego diva. Ustawienie atrybutu "z-index" nic nie daje.

Jak to ugryźć?

http://www.w3schools.com/cssref/pr_pos_z-index.asp
Zerknij co pisze w "Note".

Właśnie ustawiając position na absolute ominąłem ten problem z myślą, że jest jakieś inne wyjście, ale wychodzi na to że nie
Dzięki za odpowiedź.

Na pewno dobrą notkę przeczytałeś?

Rozumiem, że rozwinięty div ma zasłaniać div pod spodem .., który jest nie rozwinięty ?
Nie lepiej aby wszystko przesuwało się w dół ?

"Note: z-index only works on positioned elements (position:absolute, position:relative, or position:fixed)."
Dla moich potrzeb ustawiłem więc "position: absolute". Dlaczego sądzisz, że źle przeczytałem?


Kod który przytoczyłem to sztucznie stworzony wycinek aplikacji (opis problemu). Odpowiadając na pytanie: NIE, nie lepiej, bo aplikacja ma działać tak i tak i nie może się nic przesuwać.

Da przykładu, który podałeś position:relative byłby odpowiedni, ale skoro:

to ok.

Tak, jest to wycinek dużej aplikacji. Wklejanie całego kodu nie miałoby sensu. Chciałem zobrazować sam problem.
Morał: jak komu potrzeba, można użyć position:absolute, position:relative lub position:fixed i problem rozwiązany.

Temat do zamknięcia.