Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> wyskakwiwanie z diva po uzyciu float
blawat
post
Post #1





Grupa: Zarejestrowani
Postów: 31
Pomógł: 1
Dołączył: 17.03.2006

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

witam,

napotkalem na taki dosyc dziwny problem - chcialem sobie zrobic div'a z dolnym obramowaniem w jakims tam kolorze, w tym div'ie mialy znajdowac sie dwa kolejne div'y - jeden z parametrem float: left a drugi float: right -> po zaystosowaniu tych parametrow oba wew. div'y wyskakuja z div'a nadrzednego... dlaczego?

moj kod:

[HTML] pobierz, plaintext 
  1. <body>
  2.         <div id="top">
  3.             <div id="logo">
  4.                 logo
  5.             </div>
  6.             <div id="login">
  7.                 login
  8.             </div>
  9.         </div>
  10.     </body>
[HTML] pobierz, plaintext


i css

[HTML] pobierz, plaintext 
  1. root {
  2.     display: block;
  3. }
  4.  
  5. body {
  6.     font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
  7.     font-size: 13px;
  8.     padding: 0;
  9.     margin: 10px;
  10.     background-color: #fff;
  11.     text-align: center;
  12. }
  13.  
  14. #top {
  15.     width: 100%;
  16.     border-bottom: solid 1px;
  17.     border-color: #CCCCCC;    
  18. }
  19.  
  20. #logo {
  21.     float: left;    
  22. }
  23.  
  24. #login {
  25.     float: right;
  26. }
[HTML] pobierz, plaintext


wiem jak rozwiazac ta sytuacje ale nie wiem dlaczego tak sie dzieje... albo co zrobic zeby te elementy zostaly w div #top przy stosowaniu float...
Go to the top of the page
+Quote Post
thek
post
Post #2





Grupa: Moderatorzy
Postów: 4 362
Pomógł: 714
Dołączył: 12.02.2009
Skąd: Jak się położę tak leżę :D
Wyskakują, ponieważ są opływane przez wszystkie kolejne elementy. I to niezależnie czy są one w rodzicu wspólnym, czy zupełnie poza nim, ale dalej w strukturze strony. By temu zapobiegać musisz "powiadomić" stronę, że za tymi elementami musi zachowywać się normalnie, czyli zakończyć ich opływanie. To właśnie dlatego konieczne jest użycie elementu z clear:both ustawionym. Wiele osób używa też overflow, ale moim zdaniem bardziej prawidłowe i sensowniejsze pod względem logicznym jest używanie tego pierwszego.
Go to the top of the page
+Quote Post
« Następny starszy · CSS · Następny nowszy »
 

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

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 23.08.2025 - 13:50
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn