Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [CSS][HTML]problem z wyśrodkowaniem bloku.
imysz
post
Post #1





Grupa: Zarejestrowani
Postów: 54
Pomógł: 0
Dołączył: 16.08.2009

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

Witam. Mam stronę. Dwa bloki i menu. menu zfloatowane z blokiem wrapper. Blok header wyśrodkowałem za pomocą margin: 0 auto; i nie wiem jak ustawić wrappera wraz z menu na środek strony. Można prosić o pomoc ?

html
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
  3. <head>
  4.  
  5. <title>projekt_02</title>
  6. <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
  7. <meta http-equiv="content-language" content="pl" />
  8. <link rel="stylesheet" href="style.css" type="text/css" />
  9. </head>
  10.  
  11. <body>
  12.  
  13.  
  14.  
  15.  
  16. 	<div id="header">
  17.  
  18. 	<form action="" method="post">
  19. 	Login:
  20. 	<input type="text" name="login" class="form_log" />
  21. 	Password:
  22. 	<input type="password" name="pass" class="form_log" />
  23. 	<input type="submit" value="Zaloguj" />
  24. 	</form>
  25.  
  26.  
  27. 	</div>
  28.  
  29.  
  30. 		<div id="menu">
  31.  
  32. 							<ul>
  33. 							<li class="main"><a class="main" href="index.html">Home</a></li>
  34. 							<li><a class="Other" href="page1.html">Szukaj</a></li>
  35. 							<li><a class="Other" href="page2.html">Page 2</a></li>
  36. 							<li><a class="Other" href="">Page 3</a></li>
  37. 							<li ><a class="Other" href="">Page 4</a></li>
  38. 							</ul>
  39.  
  40. 							</div>
  41.  
  42.  
  43. 				<div id="wrapper">
  44. 				<p>text wrappertext wrapperteext wrapperteext wrapperteext wrappertext wrappertext wrappertext wrappertext wrappertext wrappertext wrappertext wrappertext wrappertext wrapper</p>
  45.  
  46.  
  47. 				</div>
  48.  
  49.  
  50.  
  51. </body>
  52.  
  53. </html>
[HTML] pobierz, plaintext


css:
[CSS] pobierz, plaintext 
  1. body{
  2. background-color: #E8E8E8
  3.  
  4. }
  5.  
  6. body,div,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,input,textarea,p,td {
  7.     margin:0;
  8.     padding:0;
  9. }
  10.  
  11. #header{
  12. 	background-color:white;
  13. 	width:785px;
  14. 	margin:0 auto;
  15. 	margin-top:10px;
  16. 	margin-bottom:20px;
  17. 	padding:8px;
  18. 	border: 1px solid #A9A9A9;
  19.  
  20. 	}
  21.  
  22.  
  23.     #wrapper{
  24.     float: left;
  25.     background-color:white;
  26.     margin: 0 auto;
  27.     width:780px;
  28.     padding:10px;
  29.     border: 1px solid #A9A9A9;
  30.     font-size:1.5em;
  31.     font-family:Curier New;
  32.     text-align:center;
  33.     border-left:none;
  34.  
  35. 	}
  36.  
  37. 	#menu{
  38.     float: left;
  39.  
  40.     }
  41.  
  42. #menu ul{
  43. 	width:130px;
  44. 	font-size:15px;
  45.  
  46.  
  47.  
  48. 	}
  49.  
  50.     #menu li  {
  51.     display: block;
  52.     list-style: none;
  53.     border-right:1px solid #a9a9a9;
  54.  
  55.     }
  56.  
  57. #menu a  {
  58. 	display: block;
  59. 	text-decoration:none;
  60. 	padding:10px 10px 10px 10px;
  61. 	border:1px solid #a9a9a9;
  62. 	text-align:left;
  63. 	border-right: 1px solid white;
  64. 	font-weight:bold;
  65. 	font-size:12px;
  66. 	font-family:"Lucida Grande", Arial, Helvetica, Verdana, sans-serif;
  67.  
  68.  
  69. 	}
  70.  
  71. #menu ul a:hover{
  72. 	color:#D51007;
  73. 	background:white;
  74. 	font-weight:bolder;
  75. 	}
  76.  
  77.     .main{
  78.     margin-right:20px;
  79.     width:110px;
  80.     background-color:white;
  81.     color:#D51007;
  82.     border-bottom:0px solid white;
  83.     border-right:none;
  84.     }
  85. .Other{
  86. 	background-image: url('media/menubg.png') ;
  87. 	color:gray;
  88. 	}
  89. .form_log{
  90. 		background-image:url('media/formbg.gif');
  91. 	}
[CSS] pobierz, plaintext



strona: http://test4163.ueuo.com/
pozdrawiam

Ten post edytował Ociu 13.09.2009, 10:51:30
Powód edycji: [Ociu]: poprawiłem bbcode
Go to the top of the page
+Quote Post

Posty w temacie
- imysz   [CSS][HTML]problem z wyśrodkowaniem bloku.   13.09.2009, 10:38:31
- - vonEverest   normalka, float: left; przyciąga #menu do lewej, u...   13.09.2009, 12:42:02
- - f1xer   [HTML] pobierz, plaintext <!DOCTYPE html PUBLIC...   13.09.2009, 14:18:04
- - imysz   vonEverest wcześniej miałem zrobione to za pomocą...   13.09.2009, 14:38:56
- - f1xer   ie7,ie8,ff 3.5 jest ok, w ie6 się rozwala musisz ...   13.09.2009, 17:12:49
- - imysz   a da radę zrobić teraz tak, że jeżeli strona zosta...   13.09.2009, 19:06:43

« Następny starszy · Przedszkole · Następny nowszy »
 

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

 

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

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

RSS Aktualny czas: 28.09.2025 - 04:34
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn