ugrás a tartalomhoz

középre igazítás (div)

Bageera · 2007. Ápr. 13. (P), 14.36
hello,

ime egy kis kod:

<div id="outer">
  <div id="inner">
    valtozo hosszusagu szoveg
  </div>
</div>

#outer {
width: 300px;
height: 20px;
background-color: yellow;
}

#inner {
border: 1px solid black;
//stb stb
}
kerdesem: hogy leget az "inner" div-et kozepre igazitani, a szoveg hosszusagatol fuggetlenul?
az div szelessege pont akkora kene legyen, hogy a szoveg beleferjen.


probaltam:
text-align: center - ez csak a szovegre vonatkozik
margin: auto - ehhez meg kene adni az "inner" szelesseget is

koszi elore is
bagi
 
1

display: inline;

gex · 2007. Ápr. 13. (P), 14.50
a blokk típusú elemek tulajdonsága, hogy mindig kitöltik a rendelkezésre álló helyet, kivéve, ha megadsz egy szélességet. tehát neked nem erre van szükséged.
vagy egy inline típusú elemet használj (span, strong, em, stb), vagy ha mindenképpen divet akarsz használni, akkor add meg neki a display: inline; tulajdonságot (és outer divnek a text-align: center;-t).
2

inline-block

Max Logan · 2007. Ápr. 13. (P), 20.07
Ha jól emléxem, akkor inline-nak nem lehet border-t adni. Nemrég csináltam olyat én is, hogy változó hosszúságú szöveget vegyen körül border és a megoldás a display: inline-block lett. Neki már lehet adni border-t és padding-ot is egyarát.