Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> Poprawny layout, Wzór na załączonym img
luko
post
Post #1





Grupa: Zarejestrowani
Postów: 3
Pomógł: 0
Dołączył: 16.07.2009

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

Witajcie, ostatnio sporo walczyłem żeby uzyskać layaut, który nie będzie mi się rozjeżdżał no ale niestety nie poradziłem sobie do końca tak jak bym chciał, dla tego proszę o pomoc, może widział ktoś z was takiego gotowca jak poniżej przedstawiłem lub wie jak go poprawnie wykonać.
Dodam tylko że chcę, aby każdy z div miał border 1px i długość div#margin była zależna od długości div#content.
(IMG:http://img259.imageshack.us/img259/4062/layoutxnb.jpg)
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi
luko
post
Post #2





Grupa: Zarejestrowani
Postów: 3
Pomógł: 0
Dołączył: 16.07.2009

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

Nie wychodzi mi coś...

Wiem, że trzeba powiększać szerokości o szerokość borderów, robię to a mimo to się rozjeżdża...


[HTML] pobierz, plaintext 
  1. <style>
  2.  #container
  3.  { 
  4.  width: 706px; 
  5.  margin: 0 auto; 
  6.  }
  7.  #wrap
  8.  { 
  9.  float: left; 
  10.  width: 602px; 
  11.  }
  12.  #menu 
  13.  { 
  14.  float: left; 
  15.  width: 150px; 
  16.  background: pink;
  17.  height: 400px;
  18.  
  19.  }
  20.   #content 
  21.  { 
  22.  float: right; 
  23.  width: 450px; 
  24.  background: red;
  25.  height: 400px;
  26.  border-left: 1px solid black; 
  27.  }
  28.   #header
  29.  { 
  30.  width: 100%; 
  31.  background: green;
  32.  height: 150px;
  33.  border-top: 1px solid black; 
  34.  border-bottom: 1px solid black; 
  35.  }
  36.  #margin_left
  37.  { 
  38.  float: left; 
  39.  width: 50px; 
  40.  background: blue;
  41.  height: 100%;
  42.   border: 1px solid black; 
  43.  }
  44.   #margin_right
  45.  { 
  46.  float: right; 
  47.  width: 50px; 
  48.  background: blue;
  49.  height: 100%;
  50.   border: 1px solid black; 
  51.  }
  52.  #footer{ 
  53.  height: 50px;
  54.  width: 100%;
  55.  clear: both;
  56.  background: green;
  57.  border-top: 1px solid black; 
  58.  border-bottom: 1px solid black; 
  59.  }
  60.  
  61. </style>
  62.  
  63.  <body>
  64.      <div id="container">
  65.  
  66.             <div id="margin_left"></div>  
  67.  
  68. 							<div id="wrap">
  69.  
  70.             		<div id="header"></div>
  71.  
  72.             				<div id="menu"></div>
  73.  
  74. 										<div id="content"></div>
  75.  
  76. 								<div id="footer"></div>		
  77.  
  78.               </div>    
  79.  
  80. 						<div id="margin_right"></div>              
  81.  
  82. 		</div>
  83.  
  84.  </body>
[HTML] pobierz, plaintext




Kurcze niby prosta rzecz, a nikt nie potrafi pomóc ?
Go to the top of the page
+Quote Post

Posty w temacie
- luko   Poprawny layout   16.07.2009, 08:17:47
- - singles   Wszystko ładujesz we wrappera o określon...   16.07.2009, 08:22:56
- - luko   Nie wychodzi mi coś... Wiem, że trzeba powiększać...   16.07.2009, 11:05:00
- - erix   nie myśl, że znajdziesz jelenia, który Ci wszystko...   16.07.2009, 11:37:42
- - luko   link do strony nie szukam jelenia tylko podpowied...   16.07.2009, 11:56:34
- - erix   Zacznij od wstawienia na hosting bez reklam, bo on...   16.07.2009, 12:14:08
- - singles   Podpowiedź - daj elementowi #container takie ...   16.07.2009, 13:41:58

« Następny starszy · CSS · 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: 27.12.2025 - 16:38
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn