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
banpl
post
Post #2





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

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

testowałem to tylko pod firefox'em

na chwile obecną w wygląda to tak:

IE:
(IMG:http://i49.tinypic.com/r9eads.jpg)

OPERA:
(IMG:http://i49.tinypic.com/2cxc0zo.jpg)

FIREFOX:
(IMG:http://i50.tinypic.com/55r0gp.jpg)

Cytat
Jaki jest sens robienia tego na divach, skoro widać, że najlepiej nadawałaby się tabela?

Pomyślałem sobie że na divach będzie jakoś bardziej przejrzyście i łatwiejsze w edycji. Ale jeśli nie uda znaleźć się rozwiązania to zastosuje tabelę.
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: 15.10.2025 - 01:10
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn