Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [HTML][CSS] Pozycjonowanie stopki
Ahal
post 15.10.2009, 02:46:39
Post #1





Grupa: Zarejestrowani
Postów: 1
Pomógł: 0
Dołączył: 15.09.2009

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

Witam.
Mam bardzo denerwujący problem. Tworze strone ktora ma Top (baner i menu), Srodek (2 menu po bokach i dokladny srodek na tresc ) i Stopke. Teoretycznie wszystko gra poza tym że stopka nie chce znaleść się na swoim miejscu- znaczy pod Środkiem. Czy ktoś może mi z tym pomóc ?
Kod do HTML i CSS
[HTML] pobierz, plaintext 
  1. <?xml version="1.0" encoding="iso-8859-2"?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
  4. <head>
  5.   <meta http-equiv="Content-type" content="application/xhtml+xml; charset=iso-8859-2" />
  6.   <meta name="Description" content=" [wstaw tu opis strony] " />
  7.   <meta name="Keywords" content=" [wstaw tu slowa kluczowe] " />
  8.   <meta name="Author" content=" [dane autora] " />
  9.   <meta name="Generator" content="kED" />
  10.  
  11.   <title> Mortrez </title>
  12.  
  13.   <link rel="stylesheet" href="style.css" type="text/css" />
  14. </head>
  15. <body>
  16.  
  17. <div id="banner" class="top">
  18. <p class="center">Banner</p>
  19. </div>
  20. <div id="topmenu" class="top">
  21.  
  22. <p class="center">skrocone menu</p>
  23. </div>
  24.  
  25. <div id="srodek">
  26. <div id="menu1" class="menu">
  27. <p class="center"> Menu1</p>
  28. </div>
  29. <div id="menu2" class="menu">
  30. <p class="center"> Menu2</p>
  31. </div>
  32.  
  33. <div id="podstawa" class="podstawa">
  34.  
  35. <div id="news" class="podstawa">
  36. <p class="center">newsy </p>
  37. </div>
  38.  
  39. <div id="forum" class="podstawa">
  40. <p class="center">forum</p>
  41. </div>
  42.  
  43. <div id="czat" class="podstawa">
  44. <p class="center">czat</p>
  45. </div>
  46.  
  47. </div>
  48.  
  49. </div>
  50. <div id="stopka" class="stopka">
  51. <p class="center">stopka</p>
  52. </div>
  53.  
  54.  
  55. </body>
  56. </html>
[HTML] pobierz, plaintext 

[CSS] pobierz, plaintext 
  1. html, body  
  2. 	{background: #ffffff; 
  3. 	 text-align: center; 
  4. 	 font-size: 1em; 
  5. 	 font-family: verdana, tahoma, arial, helvetica, sans-serif;
  6. 	}
  7. body *
  8. 	{margin: 0px; 
  9. 	 padding: 0px; 
  10. 	 font-size: 1em; 
  11. 	 text-align: left;
  12. 	}
  13. img 
  14.   {border: 0px;
  15. 	}
  16. h1 
  17. 	{font-size: 1.4em; 
  18. 	 font-weight: bold;
  19. 	}
  20. h2 
  21. 	{font-size: 1.2em;
  22. 	}
  23. h3
  24. 	{font-size: 1em; 
  25. 	 font-weight: bold;
  26. 	}
  27.  
  28.  
  29. td 
  30. 	{text-align: left; 
  31. 	 vertical-align: top; 
  32. 	 background: #ffffff;
  33. 	}
  34. a 
  35. 	{color: #9a0000; 
  36. 	 font-size: 1em;
  37. 	}
  38. a:visited 
  39. 	{color: #c60000;
  40. 	}
  41. a:hover 
  42. 	{color: #cb8583;
  43. 	}
  44. 	p.center
  45. 	{
  46. 	text-align: center;
  47. 	}
  48. 	div#top
  49. {
  50. height: 300px;
  51. width: 1024px;
  52. background-color: red ;
  53. position: absolute;
  54. left:auto;
  55. right:auto;
  56. top:auto;
  57. }
  58. 	div#banner
  59. 	{
  60. height: 200px;
  61. width: 1024px;
  62. background-color: pink ;
  63. }
  64.  
  65. div#topmenu
  66. {width: 1024px;
  67. height: 100px;
  68. background-color: gray;
  69. }
  70.  
  71. div#srodek
  72. {background-color: black;
  73.  
  74. position: absolute;
  75. left:auto; 
  76. right:auto; 
  77. top:auto; 
  78. bottom:auto;
  79. height:200px;}
  80.  
  81. div#menu1
  82. 	{
  83. 	background-color: yellow;
  84. 	width:250px;
  85. 	position: absolute ;
  86. 	left:0px;
  87. 	right: 724px;
  88.  
  89. }
  90.  
  91. div#podstawa
  92. {
  93. background-color: blue;
  94. width:524px;
  95. position: absolute;
  96. left:250px;
  97. right:250px;
  98.  
  99.  
  100. }
  101. div#news
  102. {
  103. width:524px;
  104. }
  105. div#forum
  106. {
  107. width:524px;
  108. }
  109. div#czat
  110. {
  111. width:524px;
  112. }
  113.  
  114. div#menu2
  115. {
  116.  
  117. background-color: green ;
  118. width: 250px;
  119. position:absolute;
  120. left:774px;
  121. right:0px;
  122.  
  123.  
  124. }
  125. div#stopka
  126. {
  127. height: 100px;
  128. width:1024px;
  129. background-color: orange;
  130. position:relative;
  131. left:auto;
  132. right:auto;
  133. bottom:0px;
  134. }
[CSS] pobierz, plaintext

Z gory dziekuje smile.gif
Go to the top of the page
+Quote Post
Victor152
post 15.10.2009, 08:47:00
Post #2





Grupa: Zarejestrowani
Postów: 105
Pomógł: 3
Dołączył: 26.02.2008

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

[CSS] pobierz, plaintext 
  1. div#stopka
  2. {
  3. height: 100px;
  4. width:1024px;
  5. background-color: orange;
  6. margin:0px auto!important;
  7. }
[CSS] pobierz, plaintext


Ten post edytował Victor152 15.10.2009, 08:47:11
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

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

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

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

RSS Wersja Lo-Fi Aktualny czas: 19.07.2025 - 11:45
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn