Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [html]Position: absolute > parent overflow: hidden
szmerak
post
Post #1





Grupa: Zarejestrowani
Postów: 286
Pomógł: 12
Dołączył: 23.11.2006
Skąd: WL

Ostrzeżenie: (0%)
-----


Witam mam problem z pozycją absolutną...

  1. .text-description { width: 800px; height: 400px; position: absolute; background: #000000; z-index: 100000; }
  2. <div style='overflow: hidden; width: 300px; height: 300px;'>
  3. <div class='text-description'>asdasd</div>
  4. </div>


Div jest w innym divie z overflow: hidden. I problem polega na tym że div jest ucięty do długości i szerokości rodzica... a chciał bym aby się nałożył na niego.
Z góry mówię że nie moge zrezygnować z overflowa ponieważ wtedy parent nie będzie się rozciągał pod jego dzieci...

Proszę o wskazówki..
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi
szmerak
post
Post #2





Grupa: Zarejestrowani
Postów: 286
Pomógł: 12
Dołączył: 23.11.2006
Skąd: WL

Ostrzeżenie: (0%)
-----


  1. .m-box { width: 450px; position: relative; clear: both; width: auto; height: auto; margin-bottom: 5px; overflow: hidden; display: block; }
  2. .m-box-content { margin: 0 3px; position: relative; overflow: hidden; display: block; }
  3. .txt-description { width: 300px; height: 200px; background: #000000; position: absolute; display: none; z-index: 10000; top: 0; left: 0; }

Jak widać próbowałem różnych kombinacji ale nic nie pomaga...

  1. <div class='m-box'>
  2. <div class='m-box-title'>Title boxa <div class='move1'><img src='img/move.gif'></div></div>
  3. <div class='m-box-content'>
  4. <ul class='links' id='txt'>
  5. <li>
  6. <a href='#'>One</a> > <a href='#' class='display'>Opis</a> <- po najechaniu na opis
  7. <div class='text-description'>asdasd</div> <- powinien pokazywać się ten div a left i top jest ustawiane przez JS
  8. </li>
  9. <li>
  10. <a href='#'>Chop Suey</a> > <a href='#' class='display'>Opis</a>
  11. <div class='text-description'>asdasd</div>
  12. </li>
  13. </ul>
  14. <ul class='last-link'>
  15. <li><a href='#'>Przejdz na teksty >></a></li>
  16. </ul>
  17. </div>
  18. </div>
  19. </div>


Ma być taki efekt obrazowo

  1. +------------[m-box]--------------+
  2. | m-title | <- TEN DIV MA SiĘ ROZCIĄGAĆ
  3. | +---------m-content--------+ |
  4. | | | |
  5. | | | |
  6. | | +-------------------+
  7. | +------------------| | <- a ten ma być zrobiony w m-content i aby mógł wyjść poza m-box...
  8. +---------------------| | a nie chowało go wyświetlając tylko część mieszczącą się w m-boxie...
  9. | text-description | i przedewszystkim wyświetlało go jak najwyżej tak aby nic nad nim nie było!
  10. | |
  11. +-------------------+


Ten post edytował szmerak 14.12.2011, 12:55:49
Go to the top of the page
+Quote Post

Posty w temacie


Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 7.10.2025 - 23:08