Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [CSS][HTML] Dwa divy obok siebie, jak zrobić aby miały taką samą wysokość, Dynamicznie
dk1342
post
Post #1





Grupa: Zarejestrowani
Postów: 275
Pomógł: 9
Dołączył: 24.07.2008
Skąd: Racibórz

Ostrzeżenie: (10%)
X----

Witam wszystkich, otóż mój problem jest taki: Mam stronę podzieloną na dwa divy. Jeden jest szerszy (tresc), drugi węższy (np na panele). I sprawa jest taka, że mam więcej treści w divie tym po lewej (szerszym) niż w tym po prawej, natomiast chce aby ten div po prawej też szedł do samego dołu, dorównując temu po lewej. Wiem, że mogę to zrobić dając na stałe height obu divom ale takiego rozwiązania jednak nie chce, bo wysokość będzie różna-dynamiczna. Jak mogę rozwiązać ten problem, aby drugi div dorównywał pierwszemu, nie ustalając height na stałe ?

Przykład obrazkowy:

Tak jest:
(IMG:http://s1.cuts.pl/img/thumb_1314130252_1.png)

Tak chciałbym:
(IMG:http://s1.cuts.pl/img/thumb_2.png)

Przykładowy kod:

[HTML] pobierz, plaintext 
  1. <html>
  2. <head>
  3. <title>Test</title>
  4. <style type="text/css">
  5. #srodek
  6. {
  7. 	width: 500px;
  8. 	margin: auto;
  9. 	border: 1px solid #000;
  10. }
  11. #lewa
  12. {
  13.     width: 300px;
  14. 	float: left;
  15. 	background: #ccc;
  16. }
  17. #prawa
  18. {
  19.    width: 200px;
  20.    float: left;
  21.    background: #000;
  22.    color: #fff;
  23. }
  24. .cleared
  25. {
  26. 	float: none;
  27. 	clear: both;
  28. 	margin: 0;
  29. 	padding: 0;
  30. 	border: none;
  31. 	font-size:1px;
  32. }
  33. </style>
  34. </head>
  35. <body>
  36. <div id="srodek">
  37. <div id="lewa">
  38. bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
  39. bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
  40. bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
  41. bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
  42. bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
  43. bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
  44. bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 			
  45. </div>
  46. <div id="prawa">
  47. bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
  48. </div>
  49. <div class="cleared"></div>
  50. </div>
  51. </body>
  52. </html>
[HTML] pobierz, plaintext


Ten post edytował dk1342 23.08.2011, 21:18:43
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi
boro11
post
Post #2





Grupa: Zarejestrowani
Postów: 283
Pomógł: 11
Dołączył: 9.07.2010
Skąd: Warszawa

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

Da się zrobić coś takiego w CSS'ie

Wystarczy zrobić obrazek tła po lewej który będzie szaro-czarny. I on będzie "robił" za to tło czarne. Gdzie widziałem tutorial do tego jak miałem podobny problem ale niestety nie jestem w stanie sobie przypomnieć gdzie.

Daj im z-index: 1; i dla tego po prawej 2 i powinno śmigać (IMG:style_emoticons/default/smile.gif)

A to tak na szybko znalezione:
http://www.dictum.netlook.pl/blog/?p=6

Nie testowałem tego i jest dosyć dziwne ale kto wie może nawet działa, nie mniej jednak polecam pierwszą metodę.
Go to the top of the page
+Quote Post

Posty w temacie
- dk1342   [CSS][HTML] Dwa divy obok siebie, jak zrobić aby miały taką samą wysokość   23.08.2011, 21:12:46
- - tolomei   jQuery: [HTML] pobierz, plaintext <head> ...   23.08.2011, 21:22:26
- - dk1342   Też myślałem o js. Jednak akurat w tym przypadku p...   23.08.2011, 21:26:00
- - boro11   Da się zrobić coś takiego w CSS'ie Wystarczy ...   23.08.2011, 21:45:55
- - tolomei   [HTML] pobierz, plaintext <div id="srodek...   23.08.2011, 21:46:00
- - dk1342   Suuper. Dziękuje.   23.08.2011, 22:02:42
- - !*!   Może i powyższe metody działają, ale są złe. Można...   24.08.2011, 09:01:42

« 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: Przełącz na: Standardowy · Przełącz na: Linearny+ · Drzewo

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

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