Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> Stopka na samym dole przegladarki!
metal
post
Post #1





Grupa: Zarejestrowani
Postów: 31
Pomógł: 0
Dołączył: 1.02.2007
Skąd: Sanok

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


Witam!

Chcialbym aby stopka na mojej stronce stopka byla na samym dole przegladarki. Zrobilem tak ale gdy wprowadze wiecej tekstu tak aby na stronce pojawil sie pasek pionowy przewijania to w firefoxie stopka nie jest rozpychana przez cala strone tylko zostaje w tym samym miejscu. Pod IE 7 oraz Opera dziala ok.

oto screen: http://img220.imageshack.us/my.php?image=firebugud2.jpg

Jak temu zaradzic?

kod HTML
  1. <meta http-equiv="content-type" content="text/html; charset=iso-8859-2">
  2. <link rel="stylesheet" href="style.css" type="text/css" />
  3. </head>
  4.  
  5. <div id="container">
  6. <div id="bannerTop"></div>
  7.  
  8. <div id="menuTop"></div>
  9.  
  10. <div id="content">
  11. <div id="menuLeft">
  12. fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br><br>
  13. fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>fdasfdasfasd<br>
  14. </div>
  15.  
  16. <div id="main">sadasdasdasdasd</div>
  17. </div>
  18.  
  19. <p style="clear: both; font-size: 0px; margin: 0px; padding: 0px;"></p>
  20.  
  21. <div id="footer"></div>
  22.  
  23. </div>
  24.  
  25. </body>
  26. </html>



KOD CSS:

  1. html {
  2. width: 100%;
  3. min-height: 100%;
  4. height: 100%!important;
  5. height: 100%;
  6. margin: 0px;
  7. padding: 0px;
  8. text-align: center;
  9. }
  10.  
  11. body {
  12. width: 100%;
  13. min-height: 100%;
  14. height: 100%!important;
  15. height: 100%;
  16. margin: 0px;
  17. padding: 0px;
  18. text-align: center;
  19. }
  20.  
  21. div#container {
  22. margin :auto;
  23. width: 1000px;
  24. min-height: 100%;
  25. height: 100%!important;
  26. height: 100%;
  27. text-align: center;
  28. position: relative;
  29. }
  30.  
  31. div#bannerTop {
  32. width: 1000px;
  33. height: 150px;
  34. background-image: url('tpl/images/bannerTop.gif');
  35. margin: auto;
  36. }
  37.  
  38. div#menuTop {
  39. width: 1000px;
  40. height: 30px;
  41. background-color: #00ff00;
  42. margin: auto;
  43. }
  44.  
  45. div#content {
  46. width: 1000px;
  47. min-height: 500px;
  48. height: auto!important;
  49. height: 500px;
  50. margin: auto;
  51. background-color: #ff0000;
  52. position: relative;
  53. }
  54.  
  55. div#menuLeft {
  56. float: left;
  57. width: 150px;
  58. min-height: 500px;
  59. height: auto!important;
  60. height: 500px;
  61. background-color: #00ff00;
  62. }
  63.  
  64. div#main {
  65. float: left;
  66. width: 850px;
  67. min-height: 500px;
  68. height: auto!important;
  69. height: 500px;
  70. background-color: #ffffff;
  71. }
  72.  
  73. div#footer {
  74. clear: both;
  75. width: 1000px;
  76. height: 40px;
  77. margin: auto;
  78. background-color: #0000ff;
  79. position: absolute;
  80. left: auto!important;
  81. left: 0px;
  82. bottom: 0px;
  83. }



Z gory dzieki za pomoc!

pozdrawiam
METAL


--------------------
tworzenie stron www - webview

Ten post edytował metal 21.11.2007, 22:54:30
Go to the top of the page
+Quote Post
guzi25
post
Post #2





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

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


div#footer {
clear: both;
width: 1000px;
height: 40px;
margin: auto;
background-color: #0000ff;
margin:0px auto;
}

styl dla stopki i bedzie dobrze, namieszane masz troche w stylach:)

http://blog.html.it/layoutgala/

Tu masz gotowe layouty jest i twoj ->http://blog.html.it/layoutgala/LayoutGala36.html (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)
Pozdrawiam
Go to the top of the page
+Quote Post
metal
post
Post #3





Grupa: Zarejestrowani
Postów: 31
Pomógł: 0
Dołączył: 1.02.2007
Skąd: Sanok

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


Ale mi nie o to chodzi.

W tym przykladowym layoucie ktory pokazales czarna stopka jest zawsze przyklejona do reszty strony nawet tak jak w tym przypadku jest mala ilosc tresci na stronie. Mi chodzi o to aby moja stopka w takim wypadku byla na samym dole okna przegladarki.

Na screenie zobacz jak moja strona wyglada gdy jest malo tresci:
http://img525.imageshack.us/my.php?image=efektre2.jpg

Ale gdy tresci jest duzo to w FF mam wlasnie problem ktory jest widoczny na screenie w pierwszym poscie.



--------------------
tworzenie stron www - webview

Ten post edytował metal 21.11.2007, 22:55:34
Go to the top of the page
+Quote Post
abc667
post
Post #4





Grupa: Zarejestrowani
Postów: 229
Pomógł: 0
Dołączył: 29.05.2007

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


no wg mnie zachowuje się tak jak powinno,

  1. position: fixed;


tak ma być
Go to the top of the page
+Quote Post
gekon
post
Post #5





Grupa: Zarejestrowani
Postów: 614
Pomógł: 7
Dołączył: 10.11.2003
Skąd: Rzeszów/Kraków

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


http://ryanfait.com/sticky-footer/ - czytaj z kodu.
Go to the top of the page
+Quote Post

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

 



RSS Aktualny czas: 24.08.2025 - 07:14