Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [CSS][HTML]problem z divami
seyoum
post
Post #1





Grupa: Zarejestrowani
Postów: 14
Pomógł: 0
Dołączył: 14.10.2009

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


chciałem uzyskać następujący efekt:

jeden div główny obejmujący pozostałe, a w nim: trochę treści, potem 2 dvy obok siebie, a następnie ostatni div pod spodem

niestety wyszło mi coś takiego:
http://www.seyoum.pl/divy.html
czasem, np przy zmienianiu wielkości okna przeglądarki, divy zawarte w głównym wyjeżdżają poza niego, jak spowodować by glówny div rozszerzał się, obejmując całą swoją zawartosć?

  1. <div style="
  2. background: #CCCCCC;
  3. border:1px solid blue;
  4. margin-left: 161px;
  5. margin-right: 161px;
  6. padding: 20px 20px 20px 20px;
  7. width:900px;
  8. "
  9. >
  10. <center><h1>Cennik</h1></center>
  11. Pacjenci z bólem - zabieg wykonujemy tego samego dnia, schemat 3 wizyt po ustąpieniu bólu i zgłoszeniu się na planowe leczenie
  12. <ol type="I">
  13. <li>Wizyta: badanie - uzupełnienie diagramu, na życzenie plan - leczenie na tej wizycie tylko dla pacjentów regularnie kontrolujących stan uzębienia</li>
  14. <li>Wizyta: plan leczenia z uwzględnieniem procedur i cen /pisemie/ i rozpoczęcie leczenia lub III</li>
  15. <li>Wizyta: rozpoczęcie leczenia od zabiegów higienizacyjnych - przynieść szczoteczkę i nici</li>
  16. </ol>
  17.  
  18. Promocje:
  19. <ul>
  20. <li>0zł profilaktyka fluorowa po piaskowaniu</li>
  21. <li>ColgateŸ Sensitive Pro-Relief (zęby nadwrażliwe) 0zł do wyczerpania zapasów</li>
  22. <li>Dopłaty, leczenie prywatne - produkty do higieny jamy ustnej lub profilaktyka za 0zł proporcjonalnie do wysokości opłat</li>
  23. <li>Diagnodent, PulppenŸ - badanie za 0zł przy kontynuacji leczenia</li>
  24. </ul>
  25.  
  26. <div style="float:left; display:inline;" >
  27. Warunki gwarancji:
  28. <ul>
  29. <li>sanacja /usunięcie kamienia, korzeni, wypełnienie ubytków, uzupełnienie brakujących zębów/</li>
  30. <li>wizyty kontrolne 4-6 miesięcy /z wpisem do karty, bezpłatne dla stałych pacjentów/</li>
  31. <li>stosowanie się do zaleceń lekarza i higienistki /m. in. zmiana nawyków dietetycznych/</li>
  32. </ul>
  33. </div>
  34.  
  35.  
  36. <div style="float:right;">
  37. Warunki promocji:
  38. <ul>
  39. <li>wizyty kontrolne 4-6 miesięcy /z wpisem do karty, bezpłatne dla stałych pacjentów/</li>
  40. <li>odwoływanie zaplanowanych wizyt w przypadku zdarzeń losowych</li>
  41. </ul>
  42. </div>
  43.  
  44. <div style="float:left; color:red;">
  45. Bezplatne wizyty kontrolne tylko dla pacjentów kontrolujących stan uzębienia min. co 6 misięcy
  46. </div>
  47.  
  48. </div> <!--tresc-->

Go to the top of the page
+Quote Post
Kshyhoo
post
Post #2





Grupa: Opiekunowie
Postów: 3 855
Pomógł: 317
Dołączył: 4.01.2005
Skąd: że




Wartości margin-left: i margin-right: musisz dać na auto i ustalić szerokość głównego DIVa.


--------------------
Go to the top of the page
+Quote Post
seyoum
post
Post #3





Grupa: Zarejestrowani
Postów: 14
Pomógł: 0
Dołączył: 14.10.2009

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


nic z tego, nie działa
Go to the top of the page
+Quote Post
vokiel
post
Post #4





Grupa: Zarejestrowani
Postów: 2 592
Pomógł: 445
Dołączył: 12.03.2007

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


Do głównego dodaj:
  1. overflow: auto;
Następnie te dwa divy co mają być obok siebie powinny mieć określoną szerokość (50% - 50% lub inną, ale tak, by mieściły się w kontenerze je zawierającym). Dla pierwszego z nich niepotrzebnie dodałeś
  1. display: inline;
Masz float, więc opływanie załatwia pozycjonowanie dwóch obok siebie.

Ostatni div, zamiast float, powinien mieć np
  1. clear: both;


--------------------
Go to the top of the page
+Quote Post
seyoum
post
Post #5





Grupa: Zarejestrowani
Postów: 14
Pomógł: 0
Dołączył: 14.10.2009

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


ok, juz dziala, dzieki smile.gif
Go to the top of the page
+Quote Post

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

 



RSS Aktualny czas: 21.08.2025 - 03:18