Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [CSS][HTML] Wysokość div'a
banpl
post
Post #1





Grupa: Zarejestrowani
Postów: 54
Pomógł: 0
Dołączył: 2.11.2005
Skąd: Radomsko

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

Witam Wszystkich (IMG:style_emoticons/default/smile.gif)

Mam problem z pewnym div'em. Szukałem jakiegoś rozwiązania w głowie oraz w internecie ale jakoś takowego nie znalazłem, dlatego piszę tutaj (IMG:style_emoticons/default/smile.gif)

Kod HTML
[HTML] pobierz, plaintext 
  1. <html>
  2.  
  3. 	<head>
  4. 		<link rel="stylesheet" href="style.css" type="text/css">
  5. 	</head>
  6.  
  7. 	<body>
  8.  
  9. 		<div class="tabela">
  10.  
  11. 			<div class="row">
  12. 				<div class="cell_dzienTygodnia">Wt</div>
  13. 				<div class="cell_colspan2">1</div>
  14. 				<div class="cell_colspan2">3</div>
  15. 				<div class="cell_colspan2">5</div>
  16. 				<div class="cell_colspan2">7</div>
  17. 				<div class="cell">9</div>
  18. 				<div class="cell">10</div>
  19. 				<div class="cell">11</div>
  20. 				<div class="cell">12</div>
  21. 			</div>
  22.  
  23. 			<div class="row">
  24. 				<div class="cell_dzienTygodnia_rowspan">Śr</div>
  25. 				<div class="cell_rowspan">
  26. 					<div class="row">
  27. 						<div class="cell">1</div>
  28. 						<div class="cell">2</div>
  29. 						<div class="cell_colspan2">3</div>
  30. 						<div class="cell_colspan2">5</div>
  31. 						<div class="cell_colspan2">7</div>
  32. 						<div class="cell">9</div>
  33. 						<div class="cell">10</div>
  34. 						<div class="cell">11</div>
  35. 						<div class="cell">12</div>
  36. 					</div>
  37. 					<div class="row">
  38. 						<div class="cell">1</div>
  39. 						<div class="cell">2</div>
  40. 						<div class="cell">3</div>
  41. 						<div class="cell">4</div>
  42. 						<div class="cell">5</div>
  43. 						<div class="cell">6</div>
  44. 						<div class="cell">7</div>
  45. 						<div class="cell_colspan2">8</div>
  46. 						<div class="cell">10</div>
  47. 						<div class="cell">11</div>
  48. 						<div class="cell">12</div>
  49. 					</div>
  50. 				</div>
  51. 			</div>
  52.  
  53. 			<div class="row">
  54. 				<div class="cell_dzienTygodnia">Czw</div>
  55. 				<div class="cell_colspan2">1</div>
  56. 				<div class="cell_colspan2">3</div>
  57. 				<div class="cell_colspan2">5</div>
  58. 				<div class="cell_colspan4">7</div>
  59. 				<div class="cell">11</div>
  60. 				<div class="cell">12</div>
  61. 			</div>
  62.  
  63. 		</div>
  64.  
  65. 	</body>
  66.  
  67. </html>
[HTML] pobierz, plaintext


plik style.css
[CSS] pobierz, plaintext 
  1. div.tabela
  2. {
  3. 	display: block;
  4. 	width: 1000px;
  5. 	border-top: 1px solid #000;
  6. 	border-right: 1px solid #000;
  7. }
  8.  
  9. div.row
  10. {
  11. 	display: block;
  12. 	width: 100%;
  13. }
  14.  
  15. div.cell_dzienTygodnia
  16. {
  17. 	display: inline-block;
  18. 	width: 39px;
  19. 	border-left: 1px solid #000;
  20. 	border-bottom: 1px solid #000;
  21. 	text-align: center;
  22. 	float: left;
  23. }
  24.  
  25. div.cell
  26. {
  27. 	display: inline-block;
  28. 	width: 79px;
  29. 	border-left: 1px solid #000;
  30. 	border-bottom: 1px solid #000;
  31. 	text-align: center;
  32. 	background-color: #CCC;
  33. 	float: left;
  34. }
  35.  
  36. div.cell_colspan2
  37. {
  38. 	display: inline-block;
  39. 	width: 159px;
  40. 	border-left: 1px solid #000;
  41. 	border-bottom: 1px solid #000;
  42. 	text-align: center;
  43. 	background-color: #9CC;
  44. 	float: left;
  45. }
  46.  
  47. div.cell_colspan3
  48. {
  49. 	display: inline-block;
  50. 	width: 239px;
  51. 	border-left: 1px solid #000;
  52. 	border-bottom: 1px solid #000;
  53. 	text-align: center;
  54. 	float: left;
  55. }
  56.  
  57. div.cell_colspan4
  58. {
  59. 	display: inline-block;
  60. 	width: 319px;
  61. 	border-left: 1px solid #000;
  62. 	border-bottom: 1px solid #000;
  63. 	text-align: center;
  64. 	float: left;
  65. }
  66.  
  67. div.cell_dzienTygodnia_rowspan
  68. {
  69. 	width: 39px;
  70. 	border-left: 1px solid #000;
  71. 	border-bottom: 1px solid #000;
  72. 	background-color: #09F;
  73. 	text-align: center;
  74. 	float: left;
  75. }
  76.  
  77. div.cell_rowspan
  78. {
  79. 	width: 960px;
  80. 	float: left;
  81. }
[CSS] pobierz, plaintext


Gdyby komuś nie chciało się przekopiowywać do pliku, zamieszczam zdjęcie
(IMG:http://i48.tinypic.com/2cr7re8.jpg)

Problem jest div'em, w którym znajduje się napis Śr.
Otóż jak zrobić aby wypełniał całą wysokość, żeby nie było białego odstępu (IMG:style_emoticons/default/questionmark.gif)
Oraz dlaczego nie wyświetla się prawy bok całości (IMG:style_emoticons/default/questionmark.gif)
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi
DarKhangel
post
Post #2





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

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

Witam.
Nie lepiej dodać border-left do głównego DIV'a? Wówczas zawsze będzie obramowanie po lewej stronie niezależnie od rozmiaru tabeli. Nie wiem czemu nie masz obramowania po prawej stronie. Podaj na jakiej przeglądarce zauważyłeś taki błąd.
Tak wyglądałby Twój kod po zmianach.
[CSS] pobierz, plaintext 
  1. div.tabela
  2. {
  3. 	display: block;
  4. 	width: 1000px;
  5. 	border-top: 1px solid #000;
  6. 	border-right: 1px solid #000;
  7. 	border-left: 1px solid #000;
  8. }
  9. div.cell_dzienTygodnia
  10. {
  11. 	display: inline-block;
  12. 	width: 39px;
  13. 	border-bottom: 1px solid #000;
  14. 	text-align: center;
  15. 	float: left;
  16. }
  17. div.cell_dzienTygodnia_rowspan
  18. {
  19. 	width: 39px;
  20. 	border-bottom: 1px solid #000;
  21. 	background-color: #09F;
  22. 	text-align: center;
  23. 	float: left;
  24. }
[CSS] pobierz, plaintext
Go to the top of the page
+Quote Post

Posty w temacie
- banpl   [CSS][HTML] Wysokość div'a   20.11.2009, 00:07:37
- - lamcpp   a nie wystarczy w arkuszu stylów dodać atrybut hei...   20.11.2009, 00:23:13
- - banpl   no niby można ale jeśli zmieni się wysokość której...   20.11.2009, 00:39:31
- - athei   Jaki jest sens robienia tego na divach, skoro wida...   20.11.2009, 08:56:46
- - DarKhangel   Witam. Nie lepiej dodać border-left do głównego DI...   20.11.2009, 12:46:35
- - banpl   testowałem to tylko pod firefox'em na chwile ...   20.11.2009, 13:00:55
- - fly474   Hej Tabele są po to by przedstawiać dane tabelary...   20.11.2009, 13:07:12
- - 230005   Nie wiem w jaki sposób na divach miałoby być bardz...   20.11.2009, 13:10:41
- - banpl   Ostatnie 2 odpowiedzi przekonały mnie do użycia je...   20.11.2009, 13:30:36

« 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: 14.10.2025 - 15:24
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn