Hirdetés
- Gyors és éles, 120 alatt: Acer Predator XB273K V5
- 5.1, 7.1 és gamer fejhallgatók
- Milyen TV-t vegyek?
- Fujifilm X
- AMD K6-III, és minden ami RETRO - Oldschool tuning
- Mini PC
- OLED TV topic
- Gigaberuházással növelné a 2 nm-es termelését a TSMC
- HiFi műszaki szemmel - sztereó hangrendszerek
- OLED monitor topic
Ú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
- Samsung 27" 2K 2560x1440 monitor Pivot is, állítható magasság S27A850D PLS panel, picit gyenge talp
- szinte új DELL C2422HE full HD 1920x1080 IPS monitor- rejtett Webkamera - nagy hangszóró - USB-C
- LG 83B4 - 83" OLED - 4K 120Hz 1ms - NVIDIA G-Sync - FreeSync Premium - HDMI 2.1 - PS5 és Xbox Ready
- 1db fekete szálka a képen! EIZO FlexScan EV2750 fekete 27" 2560x1440 2K IPS monitor PIVOT, HDMI
- EIZO FlexScan EV2495 Made in Japan! 1920x1200 IPS USB-c állítható magasság, PIVOT 2024-04 gyártás!
- ÚJ MSI CYBORG 15 A13VE - 15.6"FHD 144Hz - i5-13420H - 32GB - 1TB - Win11 - RTX 4050 -3 év garancia
- Nintendo Switch 2 // Számla + Garancia //
- REFURBISHED és ÚJ - HP USB-C/A Universal Dock G2 (5TW13AA) (DisplayLink)
- HIBÁTLAN iPhone 15 Plus 128GB Pink -1 ÉV GARANCIA - Kártyafüggetlen, MS4045, 100% Akkumulátor
- iPhone 13 mini 128GB Green -1 ÉV GARANCIA - Kártyafüggetlen, MS4052, 100% Akkumulátor
Állásajánlatok
Cég: ATW Internet 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.)


