Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> Div - powtarzanie w pionie
-jezol90-
post
Post #1





Goście
Witam

Mam taki problem. Robię stronę na div'ach i chce aby lewa i prawa krawedź bloku o wysokości 1px powtarzała się w pionie wraz z powiększaniem się zawartości strony. Chodzi mi o coś takiego jak w przypadku tabelek i komórek które zwiększają swoje rozmiary wraz z zawartością.

Kod
[HTML] pobierz, plaintext 
  1. <body>
  2. <div id="container">
  3.  
  4.         <div id="top-border"></div>
  5.         <div id="middle-div">
  6.                 <div id="left-border"></div>
  7.                 <div id="page">
  8.                         <div id="top">&nbsp;</div>
  9.                 </div>
  10.                 <div id="rigth-border"></div>
  11.         </div>
  12.         <div id="bottom-border"></div>
  13.  
  14. </div>
  15. </body>
[HTML] pobierz, plaintext


CSS
[HTML] pobierz, plaintext 
  1. body {
  2. width: 100%;
  3. height: 100%;
  4. padding: 0px;
  5. margin: 0px;
  6. background-color: #690B0B;}
  7.  
  8. #container {
  9. margin: 0px auto;
  10. background-color: #7F1818;
  11. width: 800px;
  12. margin-top: 10px;overflow: auto;}
  13.  
  14. /* obramowanie */
  15.  
  16. #top-border {
  17. width: 100%;
  18. height: 3px;
  19. background: #7F1818 url(../images/top-border.gif) no-repeat top;
  20. }
  21.  
  22. #left-border {
  23. width: 3px;
  24. height: 100%;
  25. background: #7F1818 url(../images/left-border.gif) repeat-y left;
  26. float: left;}
  27.  
  28. #right-border {
  29. width: 3px;
  30. height: 100%;
  31. background: #7F1818 url(../images/right-border.gif) repeat-y right;
  32. float: left;}
  33.  
  34. #bottom-border {
  35. width: 100%;
  36. height: 3px;
  37. background: #7F1818 url(../images/bottom-border.gif) no-repeat bottom;
  38. }
  39.  
  40. #middle-div {
  41. width: 800px;
  42. }
  43.  
  44.  
  45. #top {
  46. margin: 0px auto;
  47. height: 256px;
  48. width: 767px;
  49. margin-top: 15px;
  50. margin-bottom: 15px;
  51. background: #7F1818 url(../images/top.jpg) no-repeat top;
  52. }
[HTML] pobierz, plaintext


chodzi i oto żeby krawedzie left i right-border wyświetlały się i powiększały wraz z zawartością. Przy zmianie #left-border { height: 100% } na jakąś wyskość obramowanie powtarza się ale wykracza poza zawartośc strony.

Ten post edytował jezol90 25.07.2007, 18:24:58
Go to the top of the page
+Quote Post
abc667
post
Post #2





Grupa: Zarejestrowani
Postów: 229
Pomógł: 0
Dołączył: 29.05.2007

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

poszukaj pod hasłem faux columns
Go to the top of the page
+Quote Post
« Następny starszy · Po stronie przeglądarki · 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: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

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

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