Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Div'y
Forum PHP.pl > Forum > Po stronie przeglądarki > HTML \ XHTML
Veigerbo
27.02.2015, 15:16:03 
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html ><html>
  2. <head>
  3.   <meta http-equiv="Content-type" content="text/html; charset=iso-8859-2">
  4.   <meta name="Description" content=" [wstaw tu opis strony] ">
  5.   <meta name="Keywords" content=" [wstaw tu slowa kluczowe] ">
  6.   <meta name="Author" content=" [dane autora] ">
  7.   <meta name="Generator" content="kED2">
  8.  
  9.   <title> [tytuł strony] </title>
  10. <style>
  11. body {
  12. margin: 0;
  13. padding: 0;
  14. border-color: #cc0000;
  15. background-color: #ffffff;
  16. }
  17. p, ul, ol, li {
  18. font: 10pt Arial,geneva,Helvetica;
  19. }
  20.  
  21. h1 {
  22. font: bold 14pt Arial,Helvetica,geneva }
  23. h2 {
  24. font: bold 12pt Arial,Helvetica,geneva }
  25.  
  26. #nawigacja_lewa {
  27. position: aboslute;
  28. left: 0;
  29. width: 150px;
  30. height: 100%;
  31. margin-left: 10px;
  32. margin-top: 20px;
  33. background-color: #ddd;
  34. color: #000000;
  35. }
  36. #nawigacja_prawa{
  37. position: absolute;
  38. left: 80%;
  39. top: 20px
  40. width: 20%;
  41. padding: 5px;
  42. z-index: 1;
  43. background-color: #ddd;
  44. color: #000000;
  45. }
  46. #srodek {
  47. margin: 0px 25% 0 165px;
  48. padding: 3px;
  49. color: #000000;
  50. }
  51.  
  52. </style>
  53.   <link rel="stylesheet" href=" [nazwa_arkusza_stylow.css] " type="text/css">
  54. </head>
  55. <body>
  56. <header>
  57. <h3 style="text-align: center">Moje logo</h3>
  58. </headr>
  59. <div id="nawigacja_lewa">
  60. 	<ul>
  61. 		<li class="boczny"><a href="http://www.onet.pl">Onet</a></li>
  62. 		<li class="boczny"><a href="http://www.wp.pl"> Wirtialna Polska</a></li>
  63. 		<li class="boczny"><a href="http://interia.pl"> Interia.pl </a></li>
  64. 	</ul>
  65.  
  66. </div>
  67.  
  68. <div id="srodek">
  69. <h1>Naglowek tekstu w Div srodkowym</h1>
  70. <p> Zawartosc w"p" akapicie :: Zawartosc w"p" akapicieZawartosc w"p" akapicieZawartosc w"p" akapicieZawartosc w"p" akapicie:: Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicieZawartosc w"p" akapicie :: Zawartosc w"p" akapicieZawartosc w"p" akapicieZawartosc w"p" akapicieZawartosc w"p" akapicie:: Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicieZawartosc w"p" akapicie :: Zawartosc w"p" akapicieZawartosc w"p" akapicieZawartosc w"p" akapicieZawartosc w"p" akapicie:: Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie Zawartosc w"p" akapicie </p>
  71.  
  72. </div>
  73. <div id="nawigacja_prawa">
  74. <h1>Prawa kolumna<h1>
  75. <p>
  76. <img src="MV.png" />
  77. </p>
  78. <p>Jakis tekst <p>
  79. <p><a href="xxxxxxxx"> Napisz do mnie</a></p>
  80. </div>
  81. </body>
  82. </html>
[HTML] pobierz, plaintext


Jak sprawićaby aby nawigacja lewa, srodek i nawigacja prawa ustawialy sie obo siebie, anie pod soba ?
Przy wczesniejszych probach mi wychodzilo. Teraz analizowalem, czego mi brakuje w tym kodzie, ze nie ustawiaja sie obok siebie te 3 divy, tylko jeden pod drugim, oczywiscie z ustawieniami jakie zdeklarowałem , czyli Lewy po lewej srodek po srodku(ale pod nawigacja lewa) Potem Prawy na prawej ale pod "srodkiem".
Jakiegoś flota mi tu brakuje ?
kafowi
27.02.2015, 15:25:55
Do poprawy:

Kod
#nawigacja_lewa {
position: aboslute; /* Nie ma czegoś takiego */


Kod
#nawigacja_prawa{
position: absolute;
left: 80%;
top: 20px; /* W tym miejscu brakowało średnika */
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-2024 Invision Power Services, Inc.