ugrás a tartalomhoz

Egyéni elrendezési hiba, de hol?!

magnat · 2009. Május. 14. (Cs), 09.15
Sziasztok, annyiszor csináltam már ilyet, ezek szerint mondjuk nem elégszer, 3 div box egymás mellett, középsőbe 3 box egymás alatt, nagy kaland.. de valami nemjó, mert elcsúszik, nem látszik, stb.

Légyszives segítsetek, mi nem jó?!
  1. #container { width: 869px; height: auto; display: table; }  
  2. #left { width: 92px; height: 581px; float: left; background-image: url(left.gif); background-repeat: no-repeat; background-position: bottom; }  
  3. #center {  
  4.     width: 493px;  
  5.     height: 581px;  
  6.     float: left;  
  7. }  
  8. #1 { width: 493px; height: 57px; margin-top: 87px; }  
  9. #2 { width: 493px; height: 362px; background-image: url(background.gif); }  
  10. #3 { width: 493px; height: 75px; background-image: url(center.gif); }  
  11. #right { width: 284px; height: 581px; float: right; background-image: url(right.gif); background-repeat: no-repeat; background-position: bottom; }  
  1. <div align="center">  
  2.   <div id="container">  
  3.     <div id="left"></div>  
  4.         <div id="center">  
  5.             <div id="1"><img src="content/navigation.gif" width="493" height="57" alt="" /></div>  
  6.             <div id="2"></div>  
  7.             <div id="3"></div>  
  8.         </div>  
  9.         <div id="right"></div>  
  10.   </div>  
  11. </div>  
‹ marque Biztos trivi... prototype.js ›
 ■
1

link?

gex · 2009. Május. 14. (Cs), 09.36
jó lenne egy link, mert ha én ezt bemásolom egy fájlba akkor semmi nem látszódik a képek miatt, ellenben ff-ben semmi sincs elcsúszva. szóval kéne egy pontos hiba (igen "valami" nem jó, de mi?!) meg egy böngésző amiben produkálja a hibát.

első körben nem értem a display: table;-t, a height: auto;-t, a background tulajdonságok szétszórását (elég simán a background) és legfőképpen azt, hogy miért használsz számmal kezdődő azonosítót. firebuggal már rég rájöhettél volna, hogy semmivel sem ér többet mintha ott sem lenne.
2

köszönöm:)

magnat · 2009. Május. 14. (Cs), 09.39
igen, a szám volt a baj.. display: table;-t azért raktam be mert gugliztam és a szétcsúszásra egy fórumban ezt írták, hogy ez megoldja, amúgy ennek mi szerepe van? height: auto-t én írtam be, felesleges?
3

display: table, height: auto

gex · 2009. Május. 14. (Cs), 09.58
display: table;-t azért raktam be mert gugliztam és a szétcsúszásra egy fórumban ezt írták, hogy ez megoldja, amúgy ennek mi szerepe van?
a display tulajdonság table, table-row és table-cell értékeivel olyan táblázatnak kinéző struktúrát lehet elérni, ami a szemantikusság jegyében mégsem a table elemmel van megoldva. pl az azonos magasságú oszlopok eléréséhez nem kell 500 soros css hack. és ie8 is támogatja már.

height: auto-t én írtam be, felesleges?
igen, mert ez az alap értéke. ha nem adod meg akkor is automatikus magassága lesz. könnyen ellenőrizhető pl a w3schools oldalán.