Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS],[HTML] Problem z szablonem
Forum PHP.pl > Forum > Przedszkole
McGoo123
Witam, mam mały problem z CSSami.. chodzi dokładnie o to czy aby na pewno tak zdefiniowane będą wyświetlały się prawidłowo pod każdą rozdzielczością. Tu znajdziecie mój szablon ... martwią mnie w nim dwie rzeczy :
1) Kiedy zminimalizuje okno przeglądarki i zacznę je zmniejszać to teksty wychodzą po za divy i wszystko sie wydłuża.
2) Menu po lewej stronie jest dziwnie odsunięte od lewej strony diva, nie mogę tego usunąć. Po za tym po zminimalizowaniu okna jpgi butonów zostają w miejscu a div sie zmniejsza. blinksmiley.gif

Pomóżcie proszę...
lukasz.sekula
pierwszy błąd jaki się rzuca to nagłówek i stopka maja ustawione width w px a trzy kolumny procentowo... dlatego jak zmniejszysz okno przeglądarki zmniejszają się trzy kolumny a naglowek i stopka maja nada stały rozmiar smile.gif

poza tym odwołujesz sie do niektórych kolumn w css za pomoca id i jednoczesnie class, i masz tam powpisywane opcje które nieco sobie przeczą... to chyba na tyle

powodzenia
McGoo123
guitar.gif dzieki za pomoc... poprawiłem % ... ale nadal jest to samo ...
Cytat
masz tam powpisywane opcje które nieco sobie przeczą.
które questionmark.gif smile.gif
lukasz.sekula
chyba za szybko sie wypowiedzialem z pewnymi uwagami ale porawilem pewne sprawy tongue.gif

czemu by nie tak

HTML

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
  4. <title>Szablon - poprawiony</title>
  5. <link rel="stylesheet" type="text/css" href="szablon.css">
  6. </head>
  7.  
  8.  
  9. <div id="all">
  10. <div id="header">naglowek</div>
  11.  
  12. <div id="left">menu</div>
  13. <div id="text">tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst</div>
  14. <div id="right">prawa strona prawa strona</div>
  15.  
  16. <div id="footer">stopka</div>
  17. </div>
  18.  
  19. </body>
  20. </html>


i CSS

  1. body {
  2. margin:0;
  3. padding:0;
  4. }
  5.  
  6. #all {
  7. margin:0 auto;
  8. text-align:center;
  9. padding:0;
  10. width:800px;
  11.  
  12. }
  13.  
  14. #header {
  15. background-color:#bbb;
  16. margin:0px 0px 5px 0px;
  17. }
  18.  
  19. #left {
  20. width:200px;
  21. float:left;
  22. padding:0px 0px 5px 0px;
  23. }
  24.  
  25. #text {
  26. width:400px;
  27. float:left;
  28. padding:0px 0px 5px 0px;
  29. }
  30.  
  31. #right {
  32. width:200px;
  33. float:left;
  34. padding:0px 0px 5px 0px;
  35.  
  36. }
  37.  
  38. #footer {
  39. background-color:#bbb;
  40. clear:both;
  41. }


z tym sobie chyba poradzisz, powodzenia
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.