Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [CSS]Div wychodzi z diva, Div wychodzi z diva po zastosowaniu float
Gecko
post
Post #1





Grupa: Zarejestrowani
Postów: 2
Pomógł: 0
Dołączył: 8.01.2009

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

[HTML] pobierz, plaintext 
  2. <div class="tresc">
  3.     <div class='ramka'>
  4.         <div class='naglowek'>
  5.             Użytkownicy
  6.         </div>
  7.             aaaaaaaa            
  8.             <div class='osoba'>
  9.                 <img src=></img>
  10.                 <br>
  11.                 Kto
  12.                 <br>
  13.                 Admin
  14.             </div>
  15.             <div class='osoba'>
  16.                 <img src=></img>
  17.                 <br>
  18.                 Kto
  19.                 <br>
  20.                   Admin
  21.             </div>
  22.     </div>
  23. </div>
[HTML] pobierz, plaintext

Kod
   .tresc {
   width: 604px;
   float: left;
   overflow: hidden;
   background-color: #006699;
   height: 100%;
   }
   .naglowek
   {
   background-color: #003366;
   }
   .ramka {
   margin-left:5px;
   margin-right:5px;
   margin-bottom:15px;
   border: solid #003366 2px;
   }
   .osoba {
   margin-left:15px;
   margin-top:15px;
   text-align: center;
   width: 100px;
   }

Gdy dla .osoba nie ma ustawionego float:left; divy układają się tak:
Bez float
Zaś gdy ustawie float: left; dla .osoba:
Float left
Jak widać te mały divy (które wyświetlają w sobie obrazek etc.) wyskakują z diva ramka po ustawieniu float: left;. Dlaczego tak się dzieje?
Chcę uzyskać coś takiego:
Tak ma być
Z góry dziękuję za pomoc.
Go to the top of the page
+Quote Post
JoShiMa
post
Post #2





Grupa: Zarejestrowani
Postów: 1 374
Pomógł: 149
Dołączył: 1.03.2006

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

Cytat(Gecko @ 8.01.2009, 14:20:58 ) *
Jak widać te mały divy (które wyświetlają w sobie obrazek etc.) wyskakują z diva ramka po ustawieniu float: left;. Dlaczego tak się dzieje?

Bo właśnie na tym polega float. Diw robi się "pływający".

Cytat(Gecko @ 8.01.2009, 14:20:58 ) *
Chcę uzyskać coś takiego:
Tak ma być

Za tymi divami, które mają float wstaw jakiś niewidoczny element ze stylem clear:both; i będzie po kłopocie.

Ten post edytował JoShiMa 8.01.2009, 12:32:40
Go to the top of the page
+Quote Post
Gecko
post
Post #3





Grupa: Zarejestrowani
Postów: 2
Pomógł: 0
Dołączył: 8.01.2009

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

Dzięki, pomogło (IMG:http://forum.php.pl/style_emoticons/default/biggrin.gif)
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · 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: 26.09.2025 - 07:23
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn