Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [CSS] wyśrodkowanie menu poziomego w poziomie
nieraczek
post
Post #1





Grupa: Zarejestrowani
Postów: 405
Pomógł: 6
Dołączył: 12.01.2007

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

Na tej stronie: http://www.kurshtml.boo.pl/css/poziome_menu,menu.html znalazłem opis jak zrobić fajne błyszczące menu.
Chodzi o takie menu: http://img237.imageshack.us/my.php?image=1...08190643ge1.png
Próbowałem elementy listy umieścić w divie. Dawałem: margin: 0 auto; text-align: center; margin-left:50% itp. I nic, nie mogę tego w żaden sposób wyśrodkować w poziomie. Czy da się to jakoś wyśrodkować ?


Cały kod w niezmienionej postaci wziętej z tamtej strony wygląda tak:
[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">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>Dokument bez tytułu</title>
  6.  
  7. <style type="text/css">
  8.  
  9. ul, ul li {
  10. 	display: block;
  11. 	list-style: none;
  12. 	margin: 0;
  13. 	padding: 0;
  14. }
  15.  
  16. ul {
  17. 	float: left;
  18. 	background-color: #fff;
  19. 	padding: 1px 0 1px 1px;
  20. 	border: 1px solid #000;
  21. }
  22.  
  23. ul li {
  24. 	float: left;
  25. }
  26.  
  27. ul a:link, ul a:visited {
  28. 	text-decoration: none;
  29. 	display: block;
  30. 	font-weight: bold;
  31. 	background: #000 url("tlo.gif") repeat-x center;
  32. 	color: #fff;
  33. 	padding: 10px 20px;
  34. 	border-right: 1px solid #fff;
  35. 	border-right: 1px solid #fff;
  36. }
  37.  
  38. ul a:hover {
  39. 	background-color: #800;
  40. 	background-image: url("tlo2.gif");
  41. }
  42.  
  43.  
  44.  
  45.  
  46.  
  47.  
  48. </style>
  49. </head>
  50.  
  51. <body>
  52.  
  53.  
  54.  
  55. <ul>
  56. 		<li><a href="index">Strona1</a></li>
  57. 		<li><a href="aaaa">Strona2</a></li>
  58. 		<li><a href="bbbbbb">Strona3</a></li>
  59.         <li><a href="cccccc">Strona4</a></li>
  60. 		<li><a href="ddddd">Strona5</a></li>
  61.  
  62. </ul>
  63.  
  64.  
  65.  
  66. </body>
  67. </html>
[HTML] pobierz, plaintext
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi
-gramwzieleni-
post
Post #2





Goście
Witam własnie zaczynam swoja "przygode" z jezykami obcymi tzn html i tez zrobilem sobie te menu poziome co kolega z przed paru lat , tez od 2 dni nie umialem tego wycentrowac , dzieki "hiszpanespaniol" mi sie udalo ale nie bylo to do konca wizualnie poprawnie tzn nie bylo obramowania ze wszytskich stron wpadlem ale na pomysl zeby zamknac to w bloku tak

[HTML] pobierz, plaintext 
  1. <div id="menu">
  2. <ul class="menu_poziome">
  3. <li><a href="czcionki.html">Czcionki</a></li>
  4. <li><a href="tekst.html">Tekst</a></li>
  5. <li><a href="tlo.html">Tło</a></li>
  6. <li><a href="marginesy.html">Marginesy</a></li>
  7. <li><a href="obramowanie.html">Obramowanie</a></li>
  8. </ul>
  9. </div>
[HTML] pobierz, plaintext


i dodac do styli css to :


[HTML] pobierz, plaintext 
  1. #menu{
  2. float:right;
  3. position:relative;
  4. left: -23%;
  5. text-align:left;
  6. }
[HTML] pobierz, plaintext


nie wiem czy to prawidlowo zrobilem ale skoro dziala to dobrze , aha "left: -23%;" musialem dopasowac recznie zeby bylo po srodku
Go to the top of the page
+Quote Post

Posty w temacie
- nieraczek   [CSS] wyśrodkowanie menu poziomego w poziomie   21.11.2008, 19:15:01
- - erix   CytatPróbowałem elementy listy umieścić w divie. D...   21.11.2008, 19:23:31
- - nieraczek   Usunięcie: "float: left" w "ul...   21.11.2008, 20:05:26
- - hiszpanespaniol   wpisz coś takiego dla ul: [HTML] pobierz, plainte...   21.11.2008, 21:01:06
|- - -Basia-   Cytat(hiszpanespaniol @ 21.11.2008, 21:01...   30.06.2012, 20:58:56
- - nieraczek   Dzięki   21.11.2008, 21:49:36
- - gramwzieleni   Witam własnie zaczynam swoja "przygode" ...   21.01.2012, 04:18:36
- - wizu   Zmień sobie rozdzielczość, to przekonasz się, że n...   21.01.2012, 10:15:01

« 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: 13.10.2025 - 23:08
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn