Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [xhtml][css] Position absolute
Forum PHP.pl > Forum > Po stronie przeglądarki
rafaelb
31.07.2007, 09:47:21
Czemu position w 4 zagnieżdżonych divach odwołują sie do body a nie diva o klasie div_product ?
Chciałbym by 1 div był po lewej a 3 po prawej i najlepiej rozłożone równomiernie w pionie lub górny na górze a dolny na dole.

Lub może ktoś może doradzić jak to lepiej zrobić ? (wiem można w tabelce)


[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html>
  3.  
  4. <head>
  5. 	<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
  6. 	<title>Untitled 2</title>
  7.  
  8. <style type="text/css">
  9.  
  10. .div_product{
  11. 	border: 1px solid red;
  12. 	width:  320px;
  13. 	height: 78px;		
  14. }
  15.  
  16. .div_product_img
  17. {
  18. 	width:  120px;
  19. 	height: 78px;
  20. 	background-color: #cfcdb9;
  21. 	position: absolute;
  22. 	top: 0px;
  23. 	left: 0px;
  24. }
  25. .div_product_name
  26. {
  27. 	position: absolute;
  28. 	top: 0px;
  29. 	left: 130px;
  30. 	color: #bc5739;
  31. 	font-size: 18px;
  32. 	font-weight: bold;
  33. }
  34. .div_product_desc
  35. {
  36. 	position: absolute;
  37. 	top: 20px;
  38. 	left: 130px;	
  39. 	color: #6e6b4c;
  40. 	font-size: 10px;
  41. 	font-weight: bold;	
  42. }
  43. .div_product_more
  44. {
  45. 	position: absolute;
  46. 	bottom: 0px;
  47. 	left: 130px;	
  48. 	color: #fff;
  49. 	font-weight: bold;
  50. 	width:  70px;
  51. 	height: 14px;
  52. 	text-align: center;
  53. }
  54. 	</style>
  55.  
  56. </head>
  57.  
  58. <body>
  59.  
  60. <div class="div_product">
  61. 	<div class="div_product_img"></div>
  62. 	<div class="div_product_name">Lorem ipsum </div>
  63. 	<div class="div_product_desc">Ad viderer maiorum omittam per. Eam veritus legendos cu, mea et tation minimum.</div>
  64. 	<div class="div_product_more">lorem</div>
  65. </div>
  66.  
  67. </body>
  68. </html>
[HTML] pobierz, plaintext
revyag
31.07.2007, 10:40:38
Bo dla tego diva też musisz ustawić position.
rafaelb
31.07.2007, 12:17:39
Cytat(revyag @ 31.07.2007, 11:40:38 ) *
Bo dla tego diva też musisz ustawić position.


Dzięki działa
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.