ugrás a tartalomhoz

CSS-el elemek vízszintes kiegyenlítése

vbence · 2006. Aug. 5. (Szo), 18.53
Egy sorba, a helyet szépen elosztva szeretnék CSS-el linkeket elhelyezni, egyfajta vízszintes menüként. A linkek száma változik (3-4-5).

Táblázattal ugyebár ennyi:
  1. <table width="100%"><tr><td>első</td><td>második</td><td>harmadik</td></tr></table>  
Természetesen nem ragaszkodom minden áron a CSS-hez, csak szebb lenne...
‹ Elcsúszik az oldal a túl hosszú szavaktól fájl, hozzá tartozó szöveg feltöltése ugyanarra a lapra <FORM> tag-be ›
 ■
1

ezen ne múljék :)

toxin · 2006. Aug. 5. (Szo), 20.23
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml">  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />  
  5. <title>hello</title>  
  6. <style type="text/css">  
  7.     #menu{  
  8.         display: table;   
  9.         width: 100%;  
  10.     }  
  11.     ul{  
  12.         border: 1px solid red;  
  13.         display: table-row;  
  14.     }  
  15.       
  16.     li{  
  17.         border: 1px solid green;  
  18.         display: table-cell;  
  19.         text-align: center;  
  20.     }  
  21. </style>  
  22.   
  23. </head>  
  24.   
  25. <body>  
  26. <div id="menu"><ul><li>első</li><li>második</li><li>harmadik</li><li>negyedik</li></ul></div>  
  27. </body>  
  28. </html>  
:) egyszer majd IE is tudja kezeleni, egyébként passz maradj táblánál, ill. én is kiváncsi vagyok meglehet-e oldani

üdv t
2

hehe

vbence · 2006. Aug. 5. (Szo), 20.47
Ügyes.. tábla ami nem tábla ;) Azért még várjuk az ötelteket..
3

inline?

warnew · 2006. Aug. 5. (Szo), 22.18
Simán display: inline; width: x; nem elég?
4

re

toxin · 2006. Aug. 5. (Szo), 22.36
A linkek száma változik (3-4-5).
5

ha tudod a számukat

warnew · 2006. Aug. 5. (Szo), 23.42
akkor %os width is mehet nekik, és csst adhatsz meg a kódban is. esetleg az eloregyartott cssben csinalsz linkek_3 linkek_4 linkek_5 classokat, es azt cserelgeted.
6

alap a balról jobbra nem?

Kenguru · 2006. Aug. 6. (V), 13.50
Nem bonyolítjátok túl az életet?

<center>
<a href=#link1>link1</a> -
<a href=#link2>link2</a> -
<a href=#link3>link3</a> -
<a href=#link4>link4</a>
</center>

amibe beteszed annak a szélessége a mérvadó. a link mindegy milyen hosszú mindig középen lesz. A <center> elem is megadható CSS-el ha akarod.
7

Nem csak középre

vbence · 2006. Aug. 6. (V), 23.14
A cél az, hogy a felső táblás példához hasonlóan elosztva jelenjenek meg a inkek a sorban. A centerrel a linkek középre kerülnek, de a közöttük levő terület nem lesz kiegyelítve, nem lesznek elosztva vízszintesen.