Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS] przeciagniecie w pionie
Forum PHP.pl > Forum > Po stronie przeglądarki
aliatic
Witam!

Mam nastepujacy problem. Zrobilem sobie strone, gdzie w czesci top'u znajduja sie dwie kolumny (lewa i prawa). Wszystko bylo by fajnie, gdyby nie fakt, iz tlo w tej prawie kolumnie rozciagalo sie do konca w pionie. No ale tlo sie konczy za kazdym razem w miejscu gdzie jest ostatni tekst w tej kolumnie. No a w przypadku innych podstron w lewej czesci topu jest wiecej informacji w efekcie widok jest nastepujacy ...



... a chcialbym aby tlo rozciagalo sie do konca, az do footera (poziome tlo na samym dole powyzszego zdjecia). Stosowalem juz tlo w kolorze. Jak rowniez zdjecie rozciagane w pionie. No ale za kazdym razem efekt jest taki sam. Nie mam juz pomyslow, wiec prosze o pomoc w rozwiazaniu tego problemu. Ponizej podaje kody html i css. Moze gdzie zrobilem blad, ktorego nie widze. Dodam tylko, ze w przypadku obu kolumn w topie zastosowalem funkcje float, aby rozmiescic je obok siebie. No ale nie wiem czy ma to tutaj jakies znaczenie czy tez nie.

  1.  
  2. <div id="top">
  3. <div class="content">
  4. <div class="column">
  5. <div id="prawa_kolumna">
  6. <div class="box prawy lnews">
  7. <h2>Ostatnie newsy</h2>
  8. <div class="news ostatni">
  9. <h3>31.01.2011 r.</h3>
  10. <p>Ostatni news ...</p>
  11. <p class="wiecej"><a href="#">więcej ></a></p>
  12. </div>
  13. </div>
  14. <div class="box prawy ankieta">
  15. <h2>Ankieta</h2></br>
  16. <p>Pytanie?</p>
  17. <? include ('poll.php'); ?>
  18. </div>
  19. <div class="box prawy newsletter">
  20. <h2>Newsletter</h2>
  21. <p>Jeśli chcesz otrzymywać informację o aktualizacjach na stronie, proszę podać swój adres e-mail w poniższym polu.</p>
  22. <br />
  23. <form action="newsletter/zapisz.php" method="post">
  24. <input type="text" name="mail" size="20" maxlength="150" /><br />
  25. <input type="radio" name="akcja" value="add" checked="checked" /> Zapisz się |
  26. <input type="radio" name="akcja" value="del" /> Zrezygnuj<br />
  27. <input type="submit" value="Potwierdź" />
  28. </form>
  29. </div>
  30. </div>
  31. </div>


  1. #top #prawa_kolumna { margin: 0px; padding: 0px 0px 0px 65px;}
  2. #top .box.prawy { width: 235px; padding: 28px 15px 10px; background: #f0f0f0 url(../images/prawa_kolumna_tlo.png) top repeat-y; border-right: 1px solid #cfcfcf; border-left: 1px solid #cfcfcf;}
  3. #top .box.prawy.lnews .news.ostatni { font: 1.0em arial, tahoma, sans-serif; color: #2b2b2b;}
  4. #top .box.prawy.lnews .news h3 { color: #3389b7; padding: 15px 0 0 15px;}
  5. #top .wiecej { text-align: right;}
  6. #top .wiecej a { text-decoration: none; font-weight: bold; color: #999; padding-right: 10px;}


z gory dziekuje za pomoc!
korek_a
podobna zasada

http://www.neuroticweb.com/recursos/3-columns-layout/
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-2025 Invision Power Services, Inc.