ugrás a tartalomhoz

Formázott ul középre helyezése

Blackfriar · 2019. Jan. 1. (K), 06.37
Sziasztok !
Egy olyan ul-t szeretnék vízszintesen középre helyezni (akár pl. egy div-ben), ami pl. az alábbi formázással rendelkezik.
ul {list-style-type: upper-roman;}
Tehát nem vízszintes menüt szeretnék, ha valaki esetleg arra gondol.
A "list-style-position: inside;"-dal pont a lényeget veszítjük el.
‹ "Programozási tételek" Adatküldés kliens oldali formázással? ›
 ■
1

Tárgytalan

Blackfriar · 2019. Jan. 2. (Sze), 15.50
Úgy tűnik a problémára nincs egyszerű megoldás.
Az én megoldásomnak csak egyetlen hátránya van.
93 római számot kézzel kell beírni hozzá. :-))
3

OL nem jobb?

Pepita · 2019. Jan. 3. (Cs), 11.31
ordered list?
2

Auto margin

Pepita · 2019. Jan. 3. (Cs), 11.30
Ha egy blokk elem (pl ul) vízszintes margóját auto-ra állítod, és kisebb a szélessége, mint a szülőelemé, akkor középre fog kerülni.
<div class="parent">
<ul class="children">
<li>Valami</li>
</ul>
</div>
.parent {
width: 800px;
background: pink;
}

.children {
width: 600px;
margin: 0 auto;
background: blue;
}
4

Tök mindegy, hogy ul vagy ol

Blackfriar · 2019. Jan. 3. (Cs), 19.43
Látszólag egyszerű a feladat és mindenki csak legyint. Már megint egy hülye kérdezett egy evidenciáról.
Kiemeltem, hogy az ul-nak legyen valami list-style-type-ja. Ez adja a bukéját az dolognak. Aztán amikor azt hiszi az ember, hogy elkészült a kóddal, akkor érdemes megnézni mobilon is a dolgot. :-))

Amúgy meg az általad leírt esetben az ul-nak elég lett volna egy display:table is, width nem kell.
5

Micsoda?

Pepita · 2019. Jan. 7. (H), 08.28
Látszólag egyszerű a feladat és mindenki csak legyint. Már megint egy hülye kérdezett egy evidenciáról.
Ahogy gondolod, mindenesetre én megpróbáltam segíteni, ha nem akarod, hát nem.
Kiemeltem, hogy az ul-nak legyen valami list-style-type-ja
Ez semennyire sem befolyásolja a középre rendezését. Azt teszel rá, amit akarsz. Mi a cél? A középre rendezés, vagy a list-style-type? Melyikkel nem boldogulsz?
Aztán amikor azt hiszi az ember, hogy elkészült a kóddal, akkor érdemes megnézni mobilon is a dolgot.
Ez így van, fenti példában a pixelben megadott szélesség ezért sem a legjobb megoldás. Viszont a középre igazítást megoldja. Nyilván érdemesebb relatív méretekkel megadni és / vagy kijelző mérettől is függővé tenni.

Amúgy meg az általad leírt esetben az ul-nak elég lett volna egy display:table is, width nem kell.
Ez attól függ, hogy mit szeretnél. :)
- Ha táblázatot: akkor érdemesebb table - tr - td tageket használni a display:table és társai helyett.
- Ha (még mindig) felsorolást, akkor abban semmi helye a display:table megjelenítésnek. A DOM elemeket célszerű arra használni, amire valók. A kertész se a seprűvel próbál meg kapálni, még akkor sem, ha valaki ráírja: "ez egy kapa". Ugyanígy egy ul-re sem írjuk rá, hogy "ez egy táblázat".

Nem tudom, mi az, amin így megsértődtél, de így nem tudok többet segíteni.
6

Vagy – a példádból kiindulva

asam9 · 2019. Jan. 10. (Cs), 14.05
Vagy – a példádból kiindulva – lehet, hogy erre gondolt:
<div class="parent">  
    <ul class="children">  
        <li>Valami</li>  
    </ul>  
</div>
.parent { text-align: center; }
.children { margin: 0 auto; list-style-type: upper-roman; display: inline-block; }