Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][CSS]Problem z Float
Forum PHP.pl > Forum > Przedszkole
Raven1122
Witam mam taki styl css:

  1. #leftmenu{
  2. background:#f5f5f5;
  3. background-image:url("../images/div_top.png"),url("../images/div_bottom.png");
  4. background-position:top center, bottom center;
  5. background-repeat:repeat-x, repeat-x;
  6. width:290px;
  7. height:100%;
  8. border:1px solid #b7b7b7;
  9. float:left;
  10. }
  11.  
  12. #centerblock{
  13. background:#f5f5f5;
  14. background-image:url("../images/div_top.png"),url("../images/div_bottom.png");
  15. background-position:top center, bottom center;
  16. background-repeat:repeat-x, repeat-x;
  17. width:500px;
  18. height:100%;
  19. border:1px solid #b7b7b7;
  20. margin-left:295px;
  21. }
  22.  
  23. #rightmenu{
  24. background:#f5f5f5;
  25. background-image:url("../images/div_top.png"),url("../images/div_bottom.png");
  26. background-position:top center, bottom center;
  27. background-repeat:repeat-x, repeat-x;
  28. width:170px;
  29. height:100%;
  30. border:1px solid #b7b7b7;
  31. margin-left:815px;
  32. float:right;
  33. }


i taki kod html:

  1. <div id="leftmenu">fdgfhhfghfghfg fgh fdh fg hfdg hfh fgh f hf f f hfg hfgh fg hfdfg hfdgh hfg</div>
  2. <div id="rightmenu">fdgfhhfghfghfg fgh fdh fg hfdg hfh fgh f hf f f hfg hfgh fg hfdfg hfdgh hfg</div>
  3. <div id="centerblock">fdgfhhfghfghfg fgh fdh fg hfdg hfh fgh f hf f f hfg hfgh fg hfdfg hfdgh hfg</div>


i wyglada to nastepujaca:

leftmenu centerblock
rightmenu


right menu ucieka pod left i center, dlaczego tak sie dzieje?
Ulysess
musisz zrobić jeszcze tzw div main czyli głównego a dopiero w tego głównego wstawić te 3
Raven1122
jest juz main nazywa sie content o szerokosci 1000px tylko dalem ten kod ktorego sie dotyczy temat tak jak prosza

  1. <div id="container">
  2. <div id="header"></div>
  3. <div id="menu">
  4. </div>
  5. <div id="undermenu"></div>
  6.  
  7. <div id="content">
  8.  
  9.  
  10. <div id="leftmenu">fdgfhhfghfghfg fgh fdh fg hfdg hfh fgh f hf f f hfg hfgh fg hfdfg hfdgh hfg</div>
  11. <div id="rightmenu">fdgfhhfghfghfg fgh fdh fg hfdg hfh fgh f hf f f hfg hfgh fg hfdfg hfdgh hfg</div>
  12. <div id="centerblock">fdgfhhfghfghfg fgh fdh fg hfdg hfh fgh f hf f f hfg hfgh fg hfdfg hfdgh hfg</div>
  13.  
  14.  
  15.  
  16. <div class="clearfix"></div>
  17. </div>
  18. </div>


HTML

  1. #content{
  2. background:#c8c8c8 url("../images/content.png");
  3. background-position:top center;
  4. background-repeat:repeat-y;
  5. width:990px;
  6. height:100%;
  7. padding:5px 5px 5px 5px;
  8. }
  9.  
  10. #leftmenu{
  11. background:#f5f5f5;
  12. background-image:url("../images/div_top.png"),url("../images/div_bottom.png");
  13. background-position:top center, bottom center;
  14. background-repeat:repeat-x, repeat-x;
  15. width:290px;
  16. height:100%;
  17. border:1px solid #b7b7b7;
  18. float:left;
  19. }
  20.  
  21. #centerblock{
  22. background:#f5f5f5;
  23. background-image:url("../images/div_top.png"),url("../images/div_bottom.png");
  24. background-position:top center, bottom center;
  25. background-repeat:repeat-x, repeat-x;
  26. width:500px;
  27. height:100%;
  28. border:1px solid #b7b7b7;
  29. margin-left:295px;
  30. }
  31.  
  32. #rightmenu{
  33. background:#f5f5f5;
  34. background-image:url("../images/div_top.png"),url("../images/div_bottom.png");
  35. background-position:top center, bottom center;
  36. background-repeat:repeat-x, repeat-x;
  37. width:170px;
  38. height:100%;
  39. border:1px solid #b7b7b7;
  40. margin-left:815px;
  41. float:right;
  42. }
  43.  
  44.  
  45. .clearfix{
  46. clear:both;
  47. }

CSS
Damonsson
Źle to układasz wszystko.

Jak mnie pamięć nie myli, elementy muszą być w takiej kolejności: Prawy(float:right) > Lewy(f:left) > Środkowy(f:left).

Po co te marginesy?
Raven1122
Dziala :] Daje Pomogl biggrin.gif
Ulysess
no i własnie... smile.gif w marginesach jest problem... pamiętaj że jeśli main ma 1000 szerokości wszystkie divy które chcesz w nim poziomo ustawić musza mieć łącznie max 1000 px wraz z szerokością , obramowaniem i marginesami smile.gif
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.