Új hozzászólás Aktív témák

• #2696 Sk8erPeter nagyúr zotya678 #2692

  Új Válasz 2010-03-14 22:52:28 #2696

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Sk8erPeter

  nagyúr

  válasz zotya678 #2692 üzenetére

  Az egész sidebar div-et pakold bele a container div-be, hisz szerves részét képezi, és jelenleg külön elemként szerepel. A container div ne egy osztály (class) legyen, hanem inkább egy azonosító (id), mivel ebből úgyis csak egyetlen darab van, és a struktúra szempontjából így sokkal logikusabb. Amiből úgyis csupán egyetlen elem van, az inkább legyen azonosítóval (id) ellátott elem, és akkor a CSS-fájlban ne ponttal hivatkozz rá ( div.container), hanem kettőskereszttel:
  #container{
  /* ... */
  }
  Ezenkívül a HTML-részben írd át a <div class="container"> részt
  <div id="container">
  -re.
  A container div-nek adj meg valami fix szélességet, pl.
  #container {
  width:1024px;
  margin: 0px auto; /* középre helyezi */
  }
  Az összes padding-et és margin-t először szedd ki, én azzal kezdtem, amikor néztem az oldalad, mert annyira zavaró ez a sok negatív értékű margin, mert itt teljesen felesleges mínuszban tologatni az elemeket. Szóval most fontos, hogy úgy kezdd, hogy kitörlöd az összes padding-et, margin-t, kezdjük inkább elölről.
  A topbackground, a text és a textbottom egybe tartoznak, és külön egységet képeznek, mivel ez az egész lesz bal oldalt, jobb oldalt a menü, ezért ezt esetleg érdemes még bepakolni egy külön div-be, mert akkor egyben sokkal könnyebben tologatható, kezelhető az egész, mint külön-külön: tehát legyen mondjuk egy ilyesmi:
  <div id="main">
  <div class="topbackground"> </div>
  <div class="text"> ... </div>
  <div class="textbottom"></div>
  </div>

  Eddig összegezve: van külön egy oldalcím fejléc, az közrefogja az alatta lévőket. Legalábbis gondolom valahogy így képzelted. Az alatt bal oldalt a fő tartalom, jobb oldalt a menü.
  Most 1024px széles a fő tartalom, én ennek megfelelően a main-nek pl. 724px szélességet adok, a menünek 300-at, ezt úgy változtatod, ahogy akarod.
  A Te példádat átírva:
  #main{
  float:left;
  width:724px;
  }
  #sidebar {
  float: right;
  width: 300px;
  background: fixed
  }

  div.text-nél az a margin-top: 80px; tök felesleges, szedd ki.
  Viszont ugyanide tegyél be egy padding:10px; -et, hogy a szöveg ne folyjon egybe a kerettel.

  Legyen még egy ilyened:
  .menu{
  margin: 0px;
  }

  És szerintem kész.
  Na, de inkább feltettem a pastebinre a Te kódod kicsit javított és áttekinthetőbb változatát, nem javítottam mindenhol, de a lényeg benne van, nálam így tökéletesen jól jelenik meg, ha sok tartalom van, akkor is. Itt található: [link], itt meg a HTML-rész: [link] (egy hónapig elérhető)

  Sk8erPeter

Új hozzászólás Aktív témák