HTML és CSS - Szövegek pozicionálása?
Helló!
Valaki tudna egy kódot írni, linkelni? Példa is elég
Szóval, ha mondjuk ezt használom:
<DIV style="position: absolute; top:200px; left:20px; width:50px; height:25px; color:#FF5252; font-size:20px">Blablabla</DIV>
Akkor a top:200px és left:20px a böngészőnek a bal és fenti oldalától mért távolság. Én azt szeretném, ha lenne egy külön téglalap, egy külön keret ( akár láthatatlan ), aminek a közepe a böngésző közepén lenne. Ilyenkor mindenkinek, pl 800x600, 1368x768 vagy 2560x1920 felbontásban is a szövegek a közepén lennének. ( nem pontosan az align:middle )
ilyenre gondoltam
Kösz előre is ( Sehol nem találom neten )
válasza:Megpróbáltam sok mindent, idáig eddig jutottam
Ilyenre gondoltam. Már csak meg kéne oldani az egészet. ( mert ez nem teljesen az )
Nekem kellene egy doboz, téglalap amit fixálok. Kezdő vagyok, nem lehet számításokat végezni?
Amire gondoltam:
aDobozBalOldala == ( aBöngészőSzélessége / 2 ) - 400
Ebből könnyen ki lehetne indulni, de egy csomó gond van:
1 - lehet e számításokat végeztetni
2 - hogyan állapítja meg, mi a böngésző szélessége
válasza:próbáld ki ezt:
<html>
<head>
<style>
#wrapper, #container {
width:50px;
height:25px;
color:#FF5252;
font-size:20px;
}
#wrapper {
bottom: 50%;
right: 50%;
position:
absolute;
}
#container {
left: 50%;
position: relative;
top: 50%;
}
</style>
</head>
<body>
<div id="wrapper"><div id="container">Blablabla</div> </div>
</body>
</html>
Ez jónak tűnik
Egyre közelebb vagyok már hozzá
Azt valahogy meg lehetne oldani, hogy mint ahogy most is, a szöveg a képernyő szélességének az 50%-án van, csak még vonjon le belőle X pixelt?
Köszi ez is hasznos volt
válasza:Sikerült
Ezen az oldalon találtam meg, ha valakinek kellene még. Középre dob egy téglalapot, amit át lehet méretezni, és ehhez igazodik a text.
Ha azt szeretnéd, hogy a div horizontálisan középen legyen, akkor:
margin: 0 auto;
vagy
position: absolute;
width: 900px;
left: 50%;
margin-left: -450px;
(tehát miután a div bal szélét a képernyő közepéhez igazítod, a div szélességének felével "visszahúzod" balra.)
vagy:
width: 80%;
margin: 0 10% 0 10%;
Kapcsolódó kérdések:
Minden jog fenntartva © 2024, www.gyakorikerdesek.hu
GYIK | Szabályzat | Jogi nyilatkozat | Adatvédelem | Cookie beállítások | WebMinute Kft. | Facebook | Kapcsolat: info(kukac)gyakorikerdesek.hu
Ha kifogással szeretne élni valamely tartalommal kapcsolatban, kérjük jelezze e-mailes elérhetőségünkön!