Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [css] Div przeskakuje do nowego wiersza
Forum PHP.pl > Forum > Przedszkole
poxrimex
19.01.2008, 15:36:02
Witam!

Mam problem, gdyż div "tresc" przeskakuje mi do nowego wiersza zamiast byc w tym samym co div "menu". W Htmlu nic nie ma innego tylko kilka literek oraz same divy. A oto plik css:

[HTML] pobierz, plaintext 
  1. html, body
  2. {
  3. color: #494949;
  4. font-family: Tahoma, Helvetica, Verdana, sans-serif;
  5. text-align: center;
  6. font-size: 12px;
  7. margin-top: 0;
  8. margin-left: 0;
  9. margin-right: 0;
  10. margin-bottom: 0;
  11. }
  12.  
  13. #site
  14. {
  15. background-color: black;
  16. width: 800;
  17. margin-top: 80;
  18. margin-left: auto;
  19. margin-right: auto;
  20. }
  21.  
  22. #menu
  23. {
  24. background-color: blue;
  25. width: 220px;
  26. float: left;
  27. margin-left:10px;
  28. margin-right: auto;
  29. }
  30.  
  31. #tresc
  32. {
  33. background-color: yellow;
  34. width: 300px;
  35. float: right;
  36. margin-left: 500px;
  37. margin-right: 0px;
  38. }
[HTML] pobierz, plaintext
gekon
19.01.2008, 15:40:51
Pokaż tę parę literek w HTMLu.
poxrimex
19.01.2008, 15:50:26
Proszę bardzo:

[HTML] pobierz, plaintext 
  1. <div id="site">
  2. <div id="menu">
  3. tekst2
  4. </div>
  5. <div id="tresc">
  6. tekst1
  7. </div>
  8. </div>
[HTML] pobierz, plaintext
gekon
19.01.2008, 16:02:05 
[HTML] pobierz, plaintext 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  2. <html lang="pl">
  3. <head>
  4. 	<title></title>
  5. 	<meta http-equiv="content-type" content="text/html; charset=UTF-8">
  6. 	<style type="text/css">
  7. 		html, body
  8. {
  9. color: #494949;
  10. font-family: Tahoma, Helvetica, Verdana, sans-serif;
  11. text-align: center;
  12. font-size: 12px;
  13. margin: 0;
  14. }
  15.  
  16. #site
  17. {
  18. background-color: black;
  19. width: 800px;
  20. margin: 80px auto 0 ;
  21. }
  22.  
  23. #menu
  24. {
  25. background-color: blue;
  26. width: 220px;
  27. float: left;
  28. margin: 0 0 0 10px;
  29. }
  30.  
  31. #tresc
  32. {
  33. background-color: yellow;
  34. width: 300px;
  35. float: right;
  36. margin: 0;
  37. }
  38. 	</style>
  39. </head>
  40. <body>
  41.   <div id="site">
  42.     <div id="menu">
  43.       tekst2
  44.     </div>
  45.     <div id="tresc">
  46.       tekst1
  47.     </div>
  48.   </div>
  49. </body>
  50. </html>
[HTML] pobierz, plaintext

Niepotrzebny margines dla #tresc, pyzatym zapomniałeś dać jednostek dla szerokości i marginesu w #site.
Edyta:
Polecam dobry kurs.
poxrimex
19.01.2008, 17:02:16
jeszcze mam problem gdyż mozilla zachowuje się jakby nie widzała diva "site"
grzesiek_g
19.01.2008, 17:25:49 
[HTML] pobierz, plaintext 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  2. <html lang="pl">
  3. <head>
  4. <title></title>
  5. <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  6. <style type="text/css">
  7. html, body
  8. {
  9. color: #494949;
  10. font-family: Tahoma, Helvetica, Verdana, sans-serif;
  11. text-align: center;
  12. font-size: 12px;
  13. margin: 0;
  14. }
  15.  
  16. #site
  17. {
  18. background-color: black;
  19. width: 800px;
  20. margin: 80px auto 0 ;
  21.  
  22. /*dodaj to lub kod przy którym jest poniżej komentarz*/
  23. overflow:auto;
  24. }
  25.  
  26. #menu
  27. {
  28. background-color: blue;
  29. width: 220px;
  30. float: left;
  31. margin: 0 0 0 10px;
  32. }
  33.  
  34. #tresc
  35. {
  36. background-color: yellow;
  37. width: 300px;
  38. float: right;
  39. margin: 0;
  40. }
  41. </style>
  42. </head>
  43. <body>
  44. <div id="site">
  45. <div id="menu">
  46. tekst2
  47. </div>
  48. <div id="tresc">
  49. tekst1
  50. </div>
  51.  
  52. <br style="clear:both" /> 
  53.  
  54. </div>
  55. </body>
  56. </html>
[HTML] pobierz, plaintext
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.