Hirdetés
- Titokzatos OnePlus telefon és óra közeleg
- Honor 500-ak részletesen, minden színben
- Bemutatkozott a Poco X7 és X7 Pro
- Szakított a OnePlus és a Hasselblad
- Külföldi prepaid SIM-ek itthon
- Apple iPhone 17 Pro Max – fennsík
- Samsung Galaxy A54 - türelemjáték
- One mobilszolgáltatások
- Hivatalos a OnePlus 13 startdátuma
- Milyen hagyományos (nem okos-) telefont vegyek?
Új hozzászólás Aktív témák
-
-
Zedz
addikt
válasz
pckownz
#2196
üzenetére
Margin, padding, fontok megjelenése, általában a méretek azok amik képesek máshogy megjelenni az egyes böngészőkben. Aztán ha reszponzívra is csinálod az oldalt, képbe jönnek a mobil böngészők, amik néha képesek furcsa dolgokra.

De ha már mobil böngészők, nemrég fedeztem fel ezt a debug módszert.
-
Sk8erPeter
nagyúr
válasz
pckownz
#2193
üzenetére
Ez a trükk oldja meg, tehát hogy a selectornál használod a [style] attribútum-meghatározást is (ezzel jelzed, hogy az adott elem rendelkezik a style attribútummal, és még specifikusabbá teszed a selectort), jelen esetben pl. span[style] lesz a jó megoldás:
#fb_like_bottom > span[style], fb\:like > span[style] {
vertical-align: top !important;
}
(igazából ugyanarra az elemre vonatkozik elvileg, csak több esetet is lefedtem, hátha máshol másképp jelenik meg) -
Sk8erPeter
nagyúr
válasz
pckownz
#2190
üzenetére
Relatív pozíciót adsz a fő szülőelemnek, majd a "fixen" pozicionálni kívánt elemeknek adsz egy közös osztályt, az az osztály pedig abszolút pozíciót kap, aztán meghatározod, hogy pontosan hol is jelenik meg (left, top, ilyesmi tulajdonságok). Lesd el pl. az általad belinkelt oldalról, esetleg keress Gugliban, tuti lesz erre is Stack Overflow-találat.
-
Sk8erPeter
nagyúr
válasz
pckownz
#2188
üzenetére
Ott, ahol jelenleg is van. Hozzáadtam egy collapsed osztályt, és kicsit bénácska példával megmutatom, hogy mi történik (béna, mert setTimeouttal buzerálom a collapsed osztályt, hogy lásd, de most jó az vidékre a normális megoldásig):
https://jsfiddle.net/6sjnj1g7/5/ -
Sk8erPeter
nagyúr
válasz
pckownz
#2184
üzenetére
Gondolom arra a részre gondolsz, ami lenyílik a fölső, horizontálisan rendezett menünél, amelynek a gyerekeleme (egy dima <div>) már több, vertikálisan megjelenő (mivel fölülről lefelé vannak ott már az elemek), de horizontálisan egymás mellé rendezett listából áll.
![;]](//cdn.rios.hu/dl/s/v1.gif)
A példád nem jó ebben a formában, persze ez egyértelmű, de mondjuk olyan nagyon nem vágom, mit szerettél volna kihozni ebből.A lényeg: semmi mágia nincs benne, ilyesmi szerkezet:
<ul>
<li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
<li>
<a href="#">Aliquam tincidunt mauris eu risus.</a>
<div class="ez_lesz_a_lenyilo_gyerekelem">
<ul class="float_lefttel_egymas_melle_rendezve">
<li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
<li>Aliquam tincidunt mauris eu risus.</li>
</ul>
<ul class="float_lefttel_egymas_melle_rendezve">
<li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
<li>Aliquam tincidunt mauris eu risus.</li>
</ul>
<ul class="float_lefttel_egymas_melle_rendezve">
<li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
<li>Aliquam tincidunt mauris eu risus.</li>
</ul>
</div>
</li>
<li>Vestibulum auctor dapibus neque.</li>
</ul>Gondolom értelemszerű, hogy itt a példában a float_lefttel_egymas_melle_rendezve el lesz látva egy float: left; tulajdonsággal.
Az ez_lesz_a_lenyilo_gyerekelem osztállyal ellátott divet meg hoverre kéne előhozni, ez elvileg CSS-sel is megoldható, keress utána a dropdown menu CSS keresőszavakkal. (Természetesen sose legyen ilyen hülye nevű osztályaid, főleg ne magyarul, csak hogy érthető legyen a kód, itt azért alkalmaztam.) -
Sk8erPeter
nagyúr
válasz
pckownz
#2179
üzenetére
Attól lesz "csúnya", hogy több a hátránya, mint az előnye.

Az !important kulcsszó igazából arra való, hogy kierőszakold a Te stílus-meghatározásodat, hogy az legyen érvényes az adott elemre, ha a fene fenét eszik is. Téged nem érdekel, hogy más milyen stílust határozott meg valahol, legyen az a Te fájlod előtt vagy után, akkor is azt akarod, hogy az adott szöveg zöld legyen, és ne piros. (Igaz, ez egy másik !important szabállyal, ami ugyanerre az elemre vonatkozik, még így is felülbírálható.)
Na ezzel csak az a baj, hogy ennek nem így kellene működnie. A sorrendben legutóbb megjelenő (esetleg specifikusabb) stílus-meghatározásnak kellene érvényesülnie (amennyiben nem a szintén ocsmány style-attribútum segítségével bedrótozott megoldásokról van szó), hogy több fejlesztő is tudjon egymástól függetlenül is dolgozni, ne feltétlenül legyen szükséges mások fájljába belekontárkodni ahhoz, hogy a Te stílus-meghatározásod érvényesüljön. Bosszantó tud lenni, amikor kiderül, hogy bár Te jól definiáltad a stílust, kiderül, hogy valaki elintézte, hogy a tiéd ne legyen érvényes, mert ott az !important kulcsszó. Na és akkor ott a harc, hogy de Te pedig akkor is, és akkor Te is odacsapod az !important kulcsszót. Szóval ez így gázos.
Vannak esetek viszont, amikor nem tudsz jobbat - például épp az utóbb említett esetben, akár a Bootstrap alapvető szarait felülbírálva, vagy amikor böngésző-bővítményt fejlesztve szeretnél ráerőszakolni egy adott stílust valamilyen elemre (és mondjuk akár az oldalon alapból injektálódik később egy stíluslap, ami felülcsapná ezt a beállításodat, vagy bármi hasonló).
Új hozzászólás Aktív témák
- Acer Nitro V 15 gamer laptop RTX 4060, i5-13420H, 165 Hz!
- ZBook Fury 16 G11 16" FHD+ IPS i5-13600HX RTX 1000 Ada 32GB 512GB NVMe ujjlolv IR kam gar
- BESZÁMÍTÁS! Huawei Watch 4 Pro eSIM okosóra garanciával hibátlan működéssel
- BESZÁMÍTÁS! Apple Watch Ultra 2 49mm Cellular okosóra garanciával hibátlan működéssel
- BESZÁMÍTÁS! MSI B450M R5 5600X 32GB DDR4 512GB SSD RTX 4060 TI 16GB Rampage SHIVA A-Data 650W
- BESZÁMÍTÁS! ASUS TUF F15 FX506HE notebook - i5 11400H 16GB DDR4 512GB SSD nVidia RTX 3050Ti 4GB W11
- Törött Apple iMac 19.2 i5-8500 Radeon Pro 560X 4GB 16GB 256GB SSD 21.5" 4K Retina
- BESZÁMÍTÁS! MSI B450M R5 5600X 32GB DDR4 512GB SSD RTX 4060 TI 16GB Rampage SHIVA A-Data 650W
- Konzol felvásárlás!! Playstation 5, Playstation 5 Pro
- Kezdő Gamer PC-Számítógép!Csere-Beszámítás! I5 6500 / RX580 8GB / 16GB DDR4 / 512 SSD
Állásajánlatok
Cég: PCMENTOR SZERVIZ KFT.
Város: Budapest
Cég: Laptopműhely Bt.
Város: Budapest



![;]](http://cdn.rios.hu/dl/s/v1.gif)
Az ez_lesz_a_lenyilo_gyerekelem osztállyal ellátott divet meg hoverre kéne előhozni, ez elvileg CSS-sel is megoldható, keress utána a dropdown menu CSS keresőszavakkal. (Természetesen sose legyen ilyen hülye nevű osztályaid, főleg ne magyarul, csak hogy érthető legyen a kód, itt azért alkalmaztam.)


