Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Wyrównanie DIV
Forum PHP.pl > Forum > Po stronie przeglądarki > CSS
suchy1
4.09.2008, 21:12:12
Witam,

chciałbym sie dowiedziec jak można wyrównać div na środek ekranu ex. aling="center"; odpada ;-)

[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <head>
  3. <title>Ewa i Andrzej Szwed - Pokoje gościnne</title>
  4. <meta http-equiv="Content-Type" content="text/html; charset=windows-1250" />
  5. <meta name="robots" content="all" />
  6. <meta http-equiv="content-language" content="pl" />
  7. <link rel="stylesheet" href="css/style.css" type="text/css" />	
  8. </head>
  9. <body>
  10. <div id="all">
  11. 	<div id="top">
  12. 	<img src="grafika/logo.png"></a>
  13. 	</div>
  14.  
  15. 	<div>
  16. 		<div id="col1">
  17. 			<img src="grafika/b1.gif"></a>
  18. 		</div>
  19. 		<div id="col2">
  20. 			<img src="grafika/b1.gif"></a>
  21. 		</div>
  22. 		<div id="col3">
  23. 			<img src="grafika/b1.gif"></a>
  24. 		</div>
  25. 		<div id="col4">
  26.  
  27. 		</div>
  28. 	</div>
  29.  
  30. </div>
  31. </body>
[HTML] pobierz, plaintext


chciałbym dic "all" wyrównać na środek ekranu jak to zrobić ? na kursach nie moglem znalesc odpowiedzi. Pozdrawiam
wookieb
4.09.2008, 21:15:00
Kod
div#all
{
margin: 0 auto;
}
body
{
text-align: center; // to musi byc dla IE
}
suchy1
4.09.2008, 22:04:24
@wookieb nie pomogło. Wyrównało sie tylko logo.png

[HTML] pobierz, plaintext 
  1. *
  2. {
  3. margin: 0px;
  4. padding: 0px;
  5. }
  6.  
  7. body
  8. {
  9. background-image:url(back.png);
  10. color: #9f9f9f;
  11. font-size: 11px;
  12. font-family: "trebuchet ms", helvetica, sans-serif;
  13. text-align: center;
  14. }
  15.  
  16. a
  17. {
  18. text-decoration: underline;
  19. color: #75726F;
  20. }
  21.  
  22. #all
  23. {
  24. margin: 0 auto;
  25. }
  26.  
  27. #top
  28. {
  29. width: 572px;
  30. height: 70px;
  31. }
  32.  
  33. #footer
  34. {
  35. float: left;
  36. }
  37.  
  38. #col1
  39. {
  40. float: left;
  41. padding: 5px;
  42. }
  43.  
  44. #col2
  45. {
  46. float: left;
  47. padding: 5px;
  48. }
  49.  
  50. #col3
  51. {
  52. padding: 5px;
  53. }
  54.  
  55. #col4
  56. {
  57. float: left;
  58. padding: 5px;
  59. }
[HTML] pobierz, plaintext 


[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <title>Ewa i Andrzej Szwed - Pokoje gościnne</title>
  3. <meta http-equiv="Content-Type" content="text/html; charset=windows-1250" />
  4. <meta name="robots" content="all" />
  5. <meta http-equiv="content-language" content="pl" />
  6. <link rel="stylesheet" href="css/style.css" type="text/css" />
  7.  
  8. </head>
  9. <body>
  10. <div id="all">
  11. 	<div id="top">
  12. 	<img src="grafika/logo.png"></a>
  13. 	</div>
  14.  
  15. 	<div>
  16. 		<div id="col1">
  17. 			<img src="grafika/b1.gif"></a>
  18. 		</div>
  19. 		<div id="col2">
  20. 			<img src="grafika/b1.gif"></a>
  21. 		</div>
  22. 		<div id="col3">
  23. 			<img src="grafika/b1.gif"></a>
  24. 		</div>
  25. 		<div id="col4">
  26.  
  27. 		</div>
  28. 	</div>
  29.  
  30. 	<div id="footer">
  31.  
  32. 	</div>
  33. </div>
  34. </body>
[HTML] pobierz, plaintext


Jakies propozycje ?

dodałem width: 700 px; do div#all. Działa
wookieb
4.09.2008, 22:08:26
all musi miec okreslona szerokosc.
suchy1
4.09.2008, 22:19:26
dokładnie a wczesniej nie miałem, dzieki za pomoc :-)
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.