Új hozzászólás Aktív témák
-
#2200
Sk8erPeter
nagyúr
fordfairlane
#2198
Sk8erPeter
nagyúr
válasz
fordfairlane
#2198
üzenetére
Ez úgy emlékszem, hogy huzamosabban inkább csak az IE (talán még 9-esig?) esetén volt probléma, hogy rakott egy felesleges bordert önkényesen a képek köré, amikor senki nem kérte rá, de nincs már ez a probléma egy ideje igazából egyik említésre méltó böngészőnél sem. Az Edge, IE11, az aktuális Blink-alapú böngészők (Chrome, Opera, Vivaldi), illetve a Firefox sem rak a képek köré bordert, és így lefedtük a "normálisabb" böngészők körét (a Faszarit meg direkt nem említettem
![;]](//cdn.rios.hu/dl/s/v1.gif)
).(#2196) pckownz:
Hát ja, ez a selector csak arra az oldalra volt érvényes, ahol teszteltem.
(Konkrétan Index egyik cikkénél volt egy "Ajánlom" gomb, ott próbáltam ki.)
Ilyenkor első, hogy meg kell nyitni a fejlesztői panelt, és ránézni, hogy egyáltalán érvényes-e a selector az adott elemre. Ha nem, akkor utána kell igazítani.(#2197):
"De ha már mobil böngészők, nemrég fedeztem fel ezt a debug módszert."
Nem rossz, hasznosnak tűnik! -
#2199
pckownz
őstag
fordfairlane
#2198
pckownz
őstag
válasz
fordfairlane
#2198
üzenetére
border-right: 3px solid;
-webkit-border-image:
-webkit-gradient(linear, 0 0, 0 100%, from(#222222), to(#555555)) 1 100%;
-webkit-border-image:
-webkit-linear-gradient(#222222, #555555) 1 100%;
-moz-border-image:
-moz-linear-gradient(#222222, #555555) 1 100%;
-o-border-image:
-o-linear-gradient(#222222, #555555) 1 100%;
border-image:
linear-gradient(to bottom, #222222, #555555) 1 100%;
Erre kaptam bordereket Chrome alatt jobbrol, balrol; font es lent viszont transparent bordert rakott.border-left: 0px;
border-bottom: 0px;
border-top: 0px;
Kuszobolte, csak furcsa. -
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.
-
#2196
pckownz
őstag
Sk8erPeter
#2194
pckownz
őstag
válasz
Sk8erPeter
#2194
üzenetére
Kicsit jobban atneztem a linket, ez a rosszfiu oldotta meg:
#topbar .fb-like.fb_iframe_widget span[style]{
vertical-align: top !important;
}Koszonom
Mas:
Most eppen borderrel valo jateknal vettem eszre, hogy chrome es ff teljesen mashogy viselkedik.
Pl ha nem nullazom ki a nemkivant oldalakon a bordert, akkor a chrome odarakja. Mik a fo dolgok amikre figyelni kell, mert mas-mas bongeszon mashogy mukodnek? -
#2195
pckownz
őstag
Sk8erPeter
#2194
pckownz
őstag
válasz
Sk8erPeter
#2194
üzenetére
Sajnos nem lett megoldas. Pixelre pontosan hozza van ragasztva az elem aljahoz meg mindig. Probaltam bongeszobol is, egyszeruen nem talalom a megoldast.
Lehet a korulotte levo elemeket kellene hozza igazitanom inkabb? "Gyozzon a jobbik" -
#2194
Sk8erPeter
nagyúr
pckownz
#2193
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) -
pckownz
őstag
Facebook like/share button miatt jottem.
Barmi lehetoseg ezt a vertical-align -t felulirni?<span style="vertical-align: bottom; width: 83px; height: 20px;">
Az alabbi plugin-t hasznalom:
<div class="fb-like" data-href="https://www.facebook.com/..." data-layout="button_count" data-action="like" data-show-faces="false" data-share="false"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v2.5";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>vele probalkoztam:
#topbar .fb-like.fb-iframe_widget span{
vertical-align: top !important;
}A bongeszobe latom, hogy van css rule az elemre, viszont ott a vertical-align: bottom -ot jeleniti meg igy.
-
#2192
pckownz
őstag
Sk8erPeter
#2191
pckownz
őstag
válasz
Sk8erPeter
#2191
üzenetére
Barmi jo "gyakorlat" egyebkent a pozicionalasra? Sehogy sem tudom megetetni magammal, mindig csak tippelgetek
-
#2191
Sk8erPeter
nagyúr
pckownz
#2190
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.
-
#2190
pckownz
őstag
Sk8erPeter
#2189
pckownz
őstag
válasz
Sk8erPeter
#2189
üzenetére
De cuki, tiszta 90-esek feeling
Nem arra kerlek, hogy csinald meg helyettem, csak kivancsi lennek, hogy milyen megoldas kell ahhoz, hogy az mindegyik dropdown egy adott teruleten jelenjen meg?
-
#2189
Sk8erPeter
nagyúr
pckownz
#2188
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/ -
#2188
pckownz
őstag
Sk8erPeter
#2187
pckownz
őstag
válasz
Sk8erPeter
#2187
üzenetére
Igen, jol latod a problemam lenyeget.
Fontos kerdes, holnapig nincs idom tesztelni.Amennyiben rarakom a dropdown effektet, a "2" alatti menu hol fog megjelenni?
Ott ahol most az 1 alatti van, vagy azon a helyen ahol jelenleg is van?Talatam egy jQ plugin-t ami teljes mertekben lefedi az elkepzelest, kicsit meg herelheto is a plugin maga, de ha megtudom oldani nelkule is, akkor boldogabb leszek
-
#2187
Sk8erPeter
nagyúr
Sk8erPeter
#2186
Sk8erPeter
nagyúr
válasz
Sk8erPeter
#2186
üzenetére
Bocs, most néztem csak meg normálisan, elsőre benéztem a struktúrádat, az teljesen jónak tűnik, igazából pont olyan, amit javasoltam, szóval asszem feleslegesen koptattam az ujjamat, meg a billentyűzetemet, jól csináltad elsőre is.
Ha jól értem, csak az a baj, hogy el vannak csúszva a gyerekelemként definiált <ul> elemek, és azok beljebb tolódnak, emiatt csúnya lesz. De szólj, ha nem ez a gond.
Szóval alapból az <ul> elem kap egy bizonyos paddinget, emiatt mindig eleve beljebb tolódik, hacsak ezt nem nullázod ki egy saját stílusdefinícióval. Ezt a böngésző default stylesheetje definiálja, ezért szoktak "normalizáló", "resetelő" CSS-eket használni, hogy az ilyen alapértelmezett, böngésző által definiált stílusokat kiiktassák, és minden releváns stílus egyénileg meghatározott legyen. Szóval ha hozzáadsz egy padding-left: 0px; margin-left: 0px; stílust az <ul>-ekhez, akkor nincs eltolódás:
https://jsfiddle.net/6sjnj1g7/4/
Remélem, így értetted. (Hozzáadtam keretet az <ul>-ekhez, hogy jobban lásd, hol vannak a határok, ilyesmikkel érdemes játszani tesztelés erejéig.) -
#2186
Sk8erPeter
nagyúr
pckownz
#2184
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.
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.) -
pckownz
őstag
válasz
martonx
#2183
üzenetére
Nagyjabol ez a pelda.
Amit szeretnek, hogy li level0 egy sorban legyen
Illetve alatta jelenjen meg az ul.level0 > li.level1 hasonloan sorban, es azok alatt pedig ul.level1 > li.level2 elemekHasonlo modon, mint itt:
[link]A jQ toggle script meg van, illetve bootstrap is rendelkezesre all, azonban annak a dropdown stilusa sehogy sem hasonlit erre
-
#2182
pckownz
őstag
Sk8erPeter
#2180
pckownz
őstag
válasz
Sk8erPeter
#2180
üzenetére
Koszi
Lista:
Milyen megoldasok leteznek arra, hogy egy listat ne vertikalisan jelenitsunk meg?
Szeretnem az <ul> <li> elemeit eltagolni, box szeruen.
Tablazat jellegu peldaval tudnam korbeirni, hogy mit szerenek. -
#2180
Sk8erPeter
nagyúr
pckownz
#2179
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ó). -
#2179
pckownz
őstag
Sk8erPeter
#2178
pckownz
őstag
válasz
Sk8erPeter
#2178
üzenetére
Csunya, vagy egyeb hatranya is van?
-
#2178
Sk8erPeter
nagyúr
DNReNTi
#2176
Sk8erPeter
nagyúr
-
DNReNTi
őstag
Csak tippem van: gondolom azért, hogy a framework stílusdefiníciókat ne vágja felül a fejlesztő a sajátjaival. Például a .row egy elég beszédes class, és eséllyel készülhet belőle még egy az oldalspecifikus stíluslapon, ha valaki nem elég figyelmes. Bár hamar észre fogja venni, hogy nem pont azt látja, amit várt, de közben a BS stílus nem f*ssa el magát. Ismétlem: csak tippelem.
-
#2174
biker
nagyúr
Sk8erPeter
#2173
biker
nagyúr
válasz
Sk8erPeter
#2173
üzenetére
És még a linkre is ügyeltél
Perfekt! -
#2173
Sk8erPeter
nagyúr
#81999360
#2172
Sk8erPeter
nagyúr
válasz
#81999360
#2172
üzenetére
De ahhoz, hogy ezt a kódot alkalmazni tudd, igazából nem is kell értened a JavaScripthez különösebben, elég csak felületes tudás hozzá, hogy a script tagek közé bepakold a kódot, jelen esetben ezt:
http://jsfiddle.net/vagvL/40/
Ez az előzőnek a plain JavaScript verziója, jQuery nélkül, az ablak load eseményének elsülésekor fut le. -
#2172
#81999360
törölt tag
Sk8erPeter
#2171
#81999360
törölt tag
válasz
Sk8erPeter
#2171
üzenetére
Sajnos (vagy nem) már nem foglalkozom webfejlesztéssel. Régebben nagyon benne voltam a dologban, de akkor is inkább csak a design része. A többit ismerősömre bíztam. De oda jutottam, hogy nekem is meg kellett volna tanulni a hiányzó dolgokat. Viszont annyira lehangoló volt, hogy nem értek semmit és annyira az alapoktól kellett kezdenem... Így idő és lelkesedés hiányában feladtam.
Az SO linket köszi, megpróbálom.
-
#2171
Sk8erPeter
nagyúr
#81999360
#2170
Sk8erPeter
nagyúr
válasz
#81999360
#2170
üzenetére
Mármint miért vagytok ellenségek a JavaScripttel?
Az a webfejlesztésben nem túl szerencsés dolog.
Egyébként itt egy SO threadben azt írják, hogy lehet Tumblr-be is beágyazni saját scriptet:
http://stackoverflow.com/questions/20552391/javascript-on-individual-tumblr-post
Mellesleg a feladathoz nem kell persze jQuery, elég a plain JavaScript is, csak most így gyorsabb volt. -
#2170
#81999360
törölt tag
Sk8erPeter
#2169
#81999360
törölt tag
válasz
Sk8erPeter
#2169
üzenetére
Hmm sejtettem. Sajnos JavaScripttel még mindig ellenségek vagyunk és szerintem Tumblr oldalon meg sem oldható CSS-en kívül semmi.
Azért köszönöm. -
#2169
Sk8erPeter
nagyúr
#81999360
#2168
Sk8erPeter
nagyúr
válasz
#81999360
#2168
üzenetére
CSS-sel ilyesmit sajnos nem lehet.
Lustaságból gyorsan rágugliztam, ez a regexp felületes ránézés alapján jónak tűnik, ez alapján itt egy gyorspélda jQuery-vel:
http://jsfiddle.net/vagvL/38/ -
#81999360
törölt tag
Sziasztok,
Régen foglalkoztam már CSS-el, de most újra elő kell vennem. Fura kéréssel fordultak felém... Azt szeretnék, ha a weboldalon belül egy bizonyos betű más színű lenne. Nem megoldás, ha minden betűt belerakok egy külön class-ba, mert akkor ugye egyesével kellene mindig. Jó lenne, ha magától mondjuk nézné az összes p-t és ha olyan betűt talál, akkor átszínezi.
Lehetséges ez egyáltalán, vagy ehhez már JS is kellene?
-
martonx
veterán
Középre pozícionálás szvsz mindig is betegesen működött a CSS-ben, de itt van pár példa hozzá.
-
#2162
Cathfaern
nagyúr
fordfairlane
#2161
Cathfaern
nagyúr
válasz
fordfairlane
#2161
üzenetére
Mondjuk ettől függetlenül a vízszintes igazítást akkor is azzal oldanám meg, mert akkor nem lesz width függő.
-
#2159
fordfairlane
veterán
theo_76
#2158
fordfairlane
veterán
válasz
theo_76
#2158
üzenetére
A példa sem vízszintesen, sem függőlegesen nem igazít középre, próbáld ki többsoros szöveggel. A div blokk bal-felső sarka lesz középen, arra vonatkozik a left: 50% és top: 50%. Amennyiben a div blokk vízszintesen és függőlegesen is fix méretű, viszonylag egyszerű a korrekció:
margin-left: - width / 2
margin-top: - height / 2azaz jelen példánál
#cont {
...
width: 280px;
height: 75px;
position: absolute;
top: 50%;
left: 50%;
margin-top: -37px;
margin-left: -140px;
...
} -
theo_76
aktív tag
Sziasztok!
Hogy lehet megcsinálni, hogy egy meghatározott méretű div a böngésző megjelenítési ablakának a közepére kerüljön?
Ezzel a módszerrel csináltam meg eddig:
body {
...
margin: 0;
padding: 0;
...
}
#cont {
...
width: 280px;
height: 75px;
position: absolute;
top: 50%;
left: 50%;
...
}Függőlegesen tökéletesen igazítja középre, de vízszintesen már nem igazán kerül középre.
-
#2157
biker
nagyúr
Sk8erPeter
#2156
biker
nagyúr
válasz
Sk8erPeter
#2156
üzenetére
Nem olvastál alaposan.
Felvetettem, nem lenne-e jó, ha így lenne mert most nem így van.
Meggyőztetek, nem lenne jó, és ezért nem fogom kérni, hogy legyen átírva, hogy a less-t olvassa be.
Innentől érthetetlen ez a mostani mondatot, hogy akkor erőlködjek vele.a zipelős feltöltős szarakodással meg nem tudok mit kezdeni, ezt találta ki a fejlesztő, az én dolgom csak a css-ben leledző 100 hiba javítása
-
#2155
biker
nagyúr
Sk8erPeter
#2154
biker
nagyúr
válasz
Sk8erPeter
#2154
üzenetére
""Csak nem volt benne semmi olyan, amit tovább érdemes boncolgatni"
Korábban nem értetted, miért nem jó az, hogy a kliensoldallal generáltatod le a stylesheeteket (bár nem is értem, hogy ennyi év tapasztalat után hogy nem tudod ezt megfejteni, nem túl bonyolult képlet), látszólag azt sem vágtad, hogy van watch-lehetőség, aminek segítségével különösebb probléma nélkül a fejlesztés során is folyamatosan lehet legeneráltatni a LESS-ből a kész CSS-fájlokat, problémáztál a szerverre való feltöltésen, mondván, ez túl sok kör, és még a gyorsítótárazáson is keseregtél, valamint úgy tűnt, hogy nem is igazán találtál végső megoldást a gondjaidra. Akkor hogyhogy nem érdemes boncolgatni? Ilyen alapon minek tetted fel a kérdést?"értsd: nem akartam végtelen történetet generálni
watch lehetőségről tényleg nem hallottam
és nem mértem még soha, mennyivel több idő a kliensoldali less/css konverzió. a gépem 0,2mp alatt fordítja le, de nem egy celeron... -
#2154
Sk8erPeter
nagyúr
biker
#2153
Sk8erPeter
nagyúr
"Csak nem volt benne semmi olyan, amit tovább érdemes boncolgatni"
Korábban nem értetted, miért nem jó az, hogy a kliensoldallal generáltatod le a stylesheeteket (bár nem is értem, hogy ennyi év tapasztalat után hogy nem tudod ezt megfejteni, nem túl bonyolult képlet), látszólag azt sem vágtad, hogy van watch-lehetőség, aminek segítségével különösebb probléma nélkül a fejlesztés során is folyamatosan lehet legeneráltatni a LESS-ből a kész CSS-fájlokat, problémáztál a szerverre való feltöltésen, mondván, ez túl sok kör, és még a gyorsítótárazáson is keseregtél, valamint úgy tűnt, hogy nem is igazán találtál végső megoldást a gondjaidra. Akkor hogyhogy nem érdemes boncolgatni? Ilyen alapon minek tetted fel a kérdést?"A legtöbb kérdésre már írtam okfejtést"
Csak kimagyarázásokat láttam, hogy miért nem jó, amiket javasolunk, miért élsz inkább az eddig használt módszereiddel, de cáfold, ha nem így volt."Ami az általam használt editorhoz van plugin, az less>css ès css minify, de nincs egyben a kettő
"
És ki mondta, hogy feltétlenül az általad használt szövegszerkesztővel/fejlesztőeszközzel kellene generáltatni? Parancssorból ráküldöd a LESS watch-ot, meg a minify-oltatást, az meg csinálja a dolgát a háttérben, nem vagy a szerkesztődhöz kötve."Zipelősdi: a rendszer készítő azt találta ki, hogy az összes filet be kell zipelni, azt egy formon feltölteni, amit a rendszere használ utána vagy teszt, vagy élesben"
Imádom az ilyen retardált megoldásokat, amiknek értelme nincs, de még legalább jól el is bonyolítják a munkafolyamatot is... -
#2153
biker
nagyúr
Sk8erPeter
#2152
biker
nagyúr
válasz
Sk8erPeter
#2152
üzenetére
Csak nem volt benne semmi olyan, amit tovább érdemes boncolgatni. Ezért nem írtam rá semmit
A legtöbb kérdésre már írtam okfejtést
Ami az általam használt editorhoz van plugin, az less>css ès css minify, de nincs egyben a kettő
Zipelősdi: a rendszer készítő azt találta ki, hogy az összes filet be kell zipelni, azt egy formon feltölteni, amit a rendszere használ utána vagy teszt, vagy élesben
Okot ne kérdezd, nekem is jobb lenne egy publish de ez van, ezt kell használni -
#2152
Sk8erPeter
nagyúr
biker
#2150
Sk8erPeter
nagyúr
Az én hsz.-emre nem reagáltál, miért?
Minify-olásra van lehetőség:
http://stackoverflow.com/questions/25579926/what-is-the-best-way-to-minified-output-css-from-lessHogy a zipelésre miért van szükség, azt ennyiből nem igazán értettem.
-
biker
nagyúr
Ez ugy zajlik, szerkesztem a less-t, mentem, azonnal generálja plugin a css-t
Aztán nyomnék egy publisht, és fel is menne, ha nem egy nyomi template kezelőnek kellene zipelve és minifyvel is feltölteni, mert sajna olyan plugin nincs, ami a less/css után min.css is generálna
Plusz zipelne a full csomagot és html postolná -
Zedz
addikt
biker, ez most pontosan hogy zajlik?
Én úgy szoktam, hogy van egy scss és egy css mappám, majd sass --watch scss:css figyeli a változásokat. Aztán ha az egyik scss módosul, akkor belefordítja a css-be. Persze a projekt le van gitelve localra, majd ha végeztem akkor felpusholom a repoba.
Nem nagyon ismerem a lesst, de gondolom az sem egy ördögtől való dolog. ( legközelebb sassolj.
) -
#2148
Cathfaern
nagyúr
Sk8erPeter
#2147
Cathfaern
nagyúr
válasz
Sk8erPeter
#2147
üzenetére
"A cache-ürítés a Ctrl+F5-ös módszer miatt meg ne legyen már akkora gond, ha magadnál teszteled"
Ha fent van a konzol, akkor ez úgyse gond (ugye 1 pipa bármelyik böngészőben), márpedig azt nem tudom elképzelni hogy valaki úgy fejleszt html / css-t (vagy js-t), hogy konzolt nem használja. -
#2147
Sk8erPeter
nagyúr
biker
#2134
Sk8erPeter
nagyúr
Ez a fejlesztés szakaszában még elfogadható (de inkább nem, vagy csak kényszerhelyzetben, pl. ha (szerveroldali) előfeldolgozó épp nem áll a rendelkezésedre), productionben viszont tilos. Gondolj bele, mit is csinálsz ilyenkor: rábízod a kliensre, hogy a less.js fájlban található JavaScript-kód segítségével parse-old + előfeldolgozd a LESS-fájlodat/fájljaidat, átalakítsd a böngésző által elfogadható CSS-formátumba, majd injektáld a dokumentum head-részébe. Ez katasztrofálisan erőforrás-igényes. Szóval az a "3 kör futás" kell, bár nem kell, hogy ez olyan kényelmetlen legyen.
Érdemes lehet ezt úgy megoldani, hogy a LESS-fájlokat tartalmazó könyvtárat watch-olod az előfeldolgozóval, ami változtatás esetén azonnal legenerálja a szükséges CSS-fájlokat, és emellett folyamatosan szinkronizálod a CSS-fájlokat tartalmazó könyvtárat a távoli szerver könyvtárával (élő FTP-(vagy egyéb protokoll, mindegy)kapcsolatnál) - ez utóbbi például WinSCP-vel könnyedén megoldható (Linuxra és Macre is nyilván vannak alternatívák). Én pont ezt szoktam csinálni az SCSS/SASS-fájlokkal, már ha épp valamilyen oknál fogva nem tudok/akarok előbb MINDENT lokális környezetben tesztelni (de úgy illik!!), csak ez a kettő monitorozás kell, hogy fusson, észre sem veszed, viszont ha módosítasz a fájlon, elég gyorsan fent is van a szerveren a belőle legenerált CSS.A cache-ürítés a Ctrl+F5-ös módszer miatt meg ne legyen már akkora gond, ha magadnál teszteled, ha meg a megrendelő/más teszteli, akkor arra létezik más módszer is, hogy ne a korábban gyorsítótárazott fájlt kapja elő a böngésző.
Amit a (#2137)-ben írtál, hogy milyen hű de nagy a legenerált CSS, szemben a LESS-fájlokkal, amik sokkal kisebbek (tehát a logikád alapján jobb a less.js-sel feldolgozni a fájlokat), irreleváns, akkor sem a LESS-fájlt fogja olvasgatni a böngésződ, hanem a legenerált CSS-fájlt...
Mivel azt tudja. (És az most "mindegy" (kérdés, hogy tényleg mindegy-e, vagy lesz különbség, ugyanaz-e az előfeldolgozó minden tekintetben, bár gondolom alapvetően igen), hogy magát a CSS-fájlt szerveroldalon gyártod le, vagy a klienssel erőlködöd ki.)Szerk.: most látom Cathfaern (#2136)-os és fordfairlane (#2138)-as hsz.-ét, ők is jól és nálam kicsit rövidebben összefoglalták a lényeget.
-
biker
nagyúr
válasz
Cathfaern
#2145
üzenetére
"itt meg valamiért követelmény"
Lehet, hogy azért (mert ha jól értem) külsősökkel dolgoztatnak, és egyszerűbb azt mondani hogy tölts fel minden forrásfájlt, mint hogy azt mondják hogy ide töltsd fel amit látunk, meg majd utána add oda a forráskódokat is.kb ez az egyetlen magyarázat.
mert kiderült, nem tervezik a serveren feldolgozni a less-t, csak ezt kérik, hogy módosításkor minden less/css/min.css menjen egy zip-be, ezt kell feltölteni ami kicsomagolódik, és lehet teszt/éles nézettel összehasonlítani -
Cathfaern
nagyúr
"Viszont akkor te(ti) a less fileokat sem töltitek fel"
Így van."itt meg valamiért követelmény"
Lehet, hogy azért (mert ha jól értem) külsősökkel dolgoztatnak, és egyszerűbb azt mondani hogy tölts fel minden forrásfájlt, mint hogy azt mondják hogy ide töltsd fel amit látunk, meg majd utána add oda a forráskódokat is."mondok jobbat, akit előttem meg akartak bízni, az szerzett egy css>less visszafordítót, és belemódosított a css-be, majd abból generálta vissza a less-t, lett amilyen lett
és ez persze nem tetszett nékik."
Hát ezt nem csodálom Ugye less-nek pont az a lényege, hogy átláthatóbbá és könnyebben menedzselhetővé teszi a css "kódot". Egy ilyen visszafordítóval pont ez veszik el. -
#2144
fordfairlane
veterán
biker
#2142
fordfairlane
veterán
Viszont akkor te(ti) a less fileokat sem töltitek fel, itt meg valamiért követelmény, tehát valamit csak csinálnak vele (még mindig nem válaszoltak, miért és mit töltenek be, sebíj, ráérek, van más munka)
Azt írtad, hogy a html-ben behúzod a less fájlt, meg valami less.js feldolgozót. Vagy az egy másik honlap?
A Less fájlt oda kell feltölteni, ahol a feldolgozása történik. Ez lehet a developer gép, lehet valami közbenső staging kiszolgáló, de akár a webszerver is. Sőt, ezek szerint a kliens is feldolgozhatja, bár ez nekem új.
-
biker
nagyúr
válasz
DNReNTi
#2140
üzenetére
A CSS-t még verziókövetőbe feltolni is felesleges, jártam már úgy, hogy a gyakornok kolléga abba írt bele, aztán ment a levesbe az első compile-al.
mondok jobbat, akit előttem meg akartak bízni, az szerzett egy css>less visszafordítót, és belemódosított a css-be, majd abból generálta vissza a less-t, lett amilyen lett
és ez persze nem tetszett nékik.Viszont akkor te(ti) a less fileokat sem töltitek fel, itt meg valamiért követelmény, tehát valamit csak csinálnak vele (még mindig nem válaszoltak, miért és mit töltenek be, sebíj, ráérek, van más munka)
-
#2141
martonx
veterán
fordfairlane
#2138
martonx
veterán
válasz
fordfairlane
#2138
üzenetére
+1
-
#2140
DNReNTi
őstag
fordfairlane
#2138
DNReNTi
őstag
válasz
fordfairlane
#2138
üzenetére
+1. Ez nálam is így megy. Én csak az SCSS fájlokba írok, azt meg automatikusan fordítja a compass a konfig alapján. Feltölteni és betölteni pedig csak a CSS-t szoktam. A CSS-t még verziókövetőbe feltolni is felesleges, jártam már úgy, hogy a gyakornok kolléga abba írt bele, aztán ment a levesbe az első compile-al.
Azóta a CSS gitignore-ban van. -
#2139
biker
nagyúr
fordfairlane
#2138
biker
nagyúr
válasz
fordfairlane
#2138
üzenetére
most egyelőre arra várok, a kedves szervergazda válaszoljon, milyen beállítások futnak.
Mert pl nodejs elvileg ha van fent ugyanazon néven css és less is, behívja a less-t akkor is, ha css-t hívsz meg, nyilván ez választható opció lehet
ez ottan asp.net és nem tudom, mit hív be valójában, csak azt látom, site.css van beírva. de valamiért fel kell tölteni a less, css, és min.css-t is egyazon néven. -
#2138
fordfairlane
veterán
biker
#2137
fordfairlane
veterán
- beírom, mentem, lefordítom
- css-t mentem, minify.zem ha kell, feltöltöm
- refreshelek és cachet ürítek, hogy tutti az új jelenjen megErre szoktak scripteket használni, amik automatikusan végrehajtják ezeket a lépéseket. A refresh és cache ürítés meg nyilvánvalóan nem oldja meg másoknál a cachelési problémákat, így erre asset verziózást érdemes használni.
Talán csak én nem vagyok elég tájékozott, de eddig még nem találkoztam olyan oldallal, amelyik a kliens böngészővel végezte volna a SASS vagy LESS fájlokat.
-
biker
nagyúr
válasz
Cathfaern
#2136
üzenetére
meg mondjuk az összes css less-ben most ahogy nézem kb 2kb, a generált nem minify-zett css-ek meg közel 1MB ebben a projektben
de majd kiszámolom.amúgy annyival lenne jobb, hogy ha less-t hagyjuk benne, akkor
- van a less, kérnek egy változást
- beírom, mentem, feltöltöm
örülünk, nincs browser cache gondha a mostani megoldás, akkor
- van a less, kérnek egy változást
- beírom, mentem, lefordítom
- css-t mentem, minify.zem ha kell, feltöltöm
- refreshelek és cachet ürítek, hogy tutti az új jelenjen meg
anyázok, ha mégsem, örülök ha váletlen oknem mindegy, de lehet ez csak engem zavar
update: 60kb a LESS
690kb a css -
-
biker
nagyúr
Hát, elvileg ha a less.js-t behúzná a kedves keretrendszer, akkor a site.less elég lenne, és élesben betöltene mindent.
De mint kiderülni látszik. a less-t lefordítja css-be, és a site.css-t húzza be.
Innentől viszont hiába frissítem az al.less-t az nem fog kihatni a készre lefordított css-benSajnos ahogy nézem, ez lesz a bibi.
Csak az zavart meg, hogy van vagy 20 less file, mellé 20css, amiből mint kiderült, a less-t csak generáláshoz használják
ez így félmunka.
és a site.less-ből nem tudom legenerálni a nagy site.css-t, mert ugyan az egyedi css-ek és less-ek mind megvannak, mert átküldték, a site.less beimportálná a bootstrap.less összes állományát, ami meg nincs meg, mert az nem a testreszabható csomagban van, hanem a központilag fix csomagban. Anélkül meg compile errorSzóval most zaklatom a keretrendszer íróját, hogy ez így nem frankó
-
CSorBA
őstag
Szia biker,
kicsit zavaros amit írsz
De megpróbálom kihámozni, nem lehet, hogy arról van szó, hogy:Van több less fájlod. Ezeket importálja be egy main fájl, és ez fordul a site.css-re?
Nem lehet, hogy te csak az egyik kvázi al-less filet fordítod? Szerintem a main-t kellene, az fordításkor be fogja húzni a többi al-less filet és fordítja egybenFeltölteni természetesen csak a css-t kell, a less-re maximum a mapping miatt van szükség.
-
biker
nagyúr
válasz
DNReNTi
#2129
üzenetére
Szerintem nem megoldható, ezt fejlesztették le, cssk apróbb hibákat kell javítani
De, egy hibán próbáltam, azt a sub less filet lefordítom
De ha ezt feltöltöm, nem a javított anyag jelenik meg
Szerintem a fő site css írja felül, azt is újra kell fordítani? Az importálja a sub less filet
Az eredeti fejlesztő szerint a less és css filet is fel kell tölteni
De miért idds? Ez nekem fura. Ha a less fordul, mire kell a css is? -
brickm
őstag
Sikerült megoldani a dolgot!
A vágással volt a gond, ahogy írtátok.
Ami azért érdekes, mert öcsém ugyan úgy vágta el a képet az ő gépén, ugyan azzal a programmal, ahogy és amivel én...de az övé a style="display:block"-al megjavult teljesen.
Köszönöm az ötleteket, meg a segítséget! -
brickm
őstag
-
#2124
indigo
aktív tag
fordfairlane
#2122
indigo
aktív tag
válasz
fordfairlane
#2122
üzenetére
Igen, a felső kép 2 pixellel kevesebb...
brickm: a meglévő két képet könnyedén módosíthatod. Ha PS-ben a bal oldalhoz igazítod, ahogy a jsfiddle példádban van, akkor 1 pixel fel és 1 pixel jobbra igazítás és már jó is - tehát találkoznak a motívumok a képen. Ettől függetlenül az 1-1 pixel hiány a szélén ott lesz az alsó kép esetén.
-
#2123
brickm
őstag
fordfairlane
#2122
brickm
őstag
válasz
fordfairlane
#2122
üzenetére
Már vagy 5x elvágtam, PS-el vonalzóval, meg irfanview-al is....jónak kéne lennie. megpróbálom még szétvágni valahogy.
-
#2121
brickm
őstag
fordfairlane
#2120
brickm
őstag
válasz
fordfairlane
#2120
üzenetére
már majdnem de még midnig csúszik
-
#2116
brickm
őstag
PumpkinSeed
#2115
brickm
őstag
válasz
PumpkinSeed
#2115
üzenetére
levettem a header és a menu divek padding és margin-ját nullára, de továbbra is ugyan akkora rés maradt.
Megpróbálok mindent kivenni a css-ből és csak annyit bennehagyni ami a div elrendezéshez kell hátha -
brickm
őstag
Ha már itt tartunk.
adott a header és a menu divem, amiknek háttere van ugyebár.
Viszint a két div között hézagom van,
[link]
Végignéztem a css-ben nincs semmiféle keret, vagy eltolás beállítva.Hogyan lehetne ezt kiküszöbölni?Margin -1-2PX-el közelebb tudtam hozni őket, de még így sem az igazi.
-
martonx
veterán
Akkor tegyük tisztába a dolgokat:
"De ilyen furmányos div elrendezéseket nem használtam."
Ez nem furmányos div elrendezés volt, hanem az alap. Mint matematikában a szorzótábla. Ha a szorzás sem megy, akkor hogy akarsz később geometriát tanulni, hogy egy példával éljek."Ezzel a lendülettel a 4-5lapos weboldalamra is felesleges PHP-vel betölteni a tartalmat, meg jquery-vel kezelni a képeket."
A CMS (esetedben wordpress) használat lehet, hogy rossz gyakorlat, lehet hogy jó. Esetedben pl. korántsem biztos, hogy jó. Arra pedig gondolni sem merek, hogy mit lehet képeken jquery-vel kezelni. -
#2111
PumpkinSeed
addikt
brickm
#2110
PumpkinSeed
addikt
Ezzel a lendülettel a 4-5lapos weboldalamra is felesleges PHP-vel betölteni a tartalmat, meg jquery-vel kezelni a képeket.
Azért nem, mert a fejlődésbe az is beletartozik, hogy egyre nagyobb rendszereket kezdesz el csinálni. Ha nem PHP-ból töltöd be az adatokat akkor a statikus 4-5 oldalas weblapokról soha nem fogsz feljebb lépni.
-
#2110
brickm
őstag
fordfairlane
#2109
brickm
őstag
válasz
fordfairlane
#2109
üzenetére
Az. Ugyanis mint láthattad hiányosak az alapjaim.
Olyan dolgokat tudok megépíteni html-css-ben(meg php-ban is) amiket már láttam valahol. Vagy olyan dolgokat, amikhez az elemi részeketát tudom venni máshonnan. Nulláról pl szerintem most hirtelen egy e-mail küldő űtlap formot se tudnék csinálni, pedig 1-2 éveegész napokat töltöttem el vele, hogy 6-7 ilyen kész formból csináltam egyet, ami nekem tetszett...Csak mivel nem is csinálom sűrűn, ezért felejtek is sokat.
Nem vagyok naprakész.
Régebben sokat foglalkoztam a dologgal, de mindig is csak hobbim volt, az is marad valószínűleg.
Csak valamiért szeretek ilyesmivel időt eltölteni, így foglalkozom vele kicsit. Kitudja lehet jó lesz még valamire.Sk8erPeter
Igazad van, egyáltalán nem felesleges, sőt...
Ezzel a lendülettel a 4-5lapos weboldalamra is felesleges PHP-vel betölteni a tartalmat, meg jquery-vel kezelni a képeket. Pusztán az egyszerűsítés és a dizájn hozta ezt. Gondolom előbb utóbb a bootstrap-et is így fogom kezelni. Kipróbáltam egyébként, és bár a css-emet át kell gondolni, mert a méreteltérések eltoltak mindent, tetszik a dolog, valóban könnyebb vele dobozolni. -
#2108
Sk8erPeter
nagyúr
brickm
#2104
Sk8erPeter
nagyúr
"Nem ismerem konkrétan a bootstrap -et, de ahogy nézegetem a leírását, eléggé felesleges ennyire megbonyolítani egy sima passzív weblapot."
Ez így általánosságban természetesen nagyon nem igaz. Azt, hogy milyen mértékben segíti a munkádat egy ilyen frontend framework, a későbbiekben fogod igazán értékelni, amikor már érteni fogod a HTML és CSS működését mélyebben is. Kezdőként viszont jobb, ha végigjárod az utat, és kézzel rakod össze az oldalaidat, tényleg nem érdemes nekiesni egyből ilyen komplex állattal; később viszont nagyon jól fog jönni. -
#2107
CSorBA
őstag
fordfairlane
#2105
CSorBA
őstag
válasz
fordfairlane
#2105
üzenetére
Azért azt ne felejtsük el, hogy te megtudod csinálni floatokkal szórakozva is, míg Ő (egyelőre) nem
-
#2106
brickm
őstag
fordfairlane
#2105
brickm
őstag
válasz
fordfairlane
#2105
üzenetére
Értem.
Kipróbálom minden estre, igazából veszteni nem fogok vele, legalább látom mit lehet vele csinálni.
Régen a postokat is manuálisan írtam kód formájában meg a lapomra, míg ki nem próbáltam a wordpress-t, azóta automatizálgatom a postolási metódust. Hátha ez is visz valami pluszt a dologba. -
#2105
fordfairlane
veterán
brickm
#2104
fordfairlane
veterán
Nem ismerem konkrétan a bootstrap -et, de ahogy nézegetem a leírását, eléggé felesleges ennyire megbonyolítani egy sima passzív weblapot.
Én a bootstrap nélkül egy egyoldalas landingot sem csinálok már. Sokkal egyszerűbb a grid rendszert használni, mint floatokkal szórakozni.
-
brickm
őstag
Csináltam már vagy 3-4 egyszerűnek mondható weboldalt, köztük a sajátomat is. De ilyen furmányos div elrendezéseket nem használtam. Eddig nem is nagyon érdekelt hogy kéne ezt megvalósítani,csak most, hogy helyzet hozta.
Nem ismerem konkrétan a bootstrap -et, de ahogy nézegetem a leírását, eléggé felesleges ennyire megbonyolítani egy sima passzív weblapot. -
#2103
martonx
veterán
fordfairlane
#2102
martonx
veterán
válasz
fordfairlane
#2102
üzenetére
Csak puszta vélemény, de ez olyan alap feladat, amin keresztül aztán az egész html-t, css-t meg lehet érteni, kár ehhez bootstrap-pel nekirohanni.
-
#2102
fordfairlane
veterán
brickm
#2101
-
#2101
brickm
őstag
PumpkinSeed
#2100
brickm
őstag
válasz
PumpkinSeed
#2100
üzenetére
Áhá.
Értem már. Ahogy látom csoportosítást csináltál. Erre nem gondoltam igazából.
Köszönöm a segítséget!
![;]](http://cdn.rios.hu/dl/s/v1.gif)
).
(Konkrétan Index egyik cikkénél volt egy "Ajánlom" gomb, ott próbáltam ki.)
Ha jól értem, csak az a baj, hogy el vannak csúszva a gyerekelemként definiált <ul> elemek, és azok beljebb tolódnak, emiatt csúnya lesz. De szólj, ha nem ez a gond.
Mivel azt tudja. (És az most "mindegy" (kérdés, hogy tényleg mindegy-e, vagy lesz különbség, ugyanaz-e az előfeldolgozó minden tekintetben, bár gondolom alapvetően igen), hogy magát a CSS-fájlt szerveroldalon gyártod le, vagy a klienssel erőlködöd ki.)
Új hozzászólás Aktív témák
- Iszonyatos mennyiségű hulladékkal járhat a Windows 10 terméktámogatásának vége
- Audi, Cupra, Seat, Skoda, Volkswagen topik
- A fociról könnyedén, egy baráti társaságban
- Külföldi SIM-ek itthon
- Lakáshitel, lakásvásárlás
- AMD Ryzen 9 / 7 / 5 7***(X) "Zen 4" (AM5)
- Ingatlanos topic!
- Házimozi belépő szinten
- Dell asztali gépek
- Válságba taszíthatja Oregon államot az Intel leépítése
- További aktív témák...
- ÁRGARANCIA! Épített KomPhone Ryzen 5 9600X 32/64GB RTX 5070 12GB GAMER PC termékbeszámítással
- ÁRGARANCIA! Épített KomPhone i5 14400F 32/64GB RAM RTX 5060Ti 8GB GAMER PC termékbeszámítással
- Samsung Galaxy A23 5G 128GB, Kártyafüggetlen, 1 Év Garanciával
- Telefon felvásárlás!! Xiaomi Redmi Note 13, Xiaomi Redmi Note 13 Pro, Xiaomi Redmi Note 13 Pro+
- Eladó karcmentes állapotban levő Apple iPhone 14 Plus 256GB / AKKU 100% / 12 hónap jótállás
Állásajánlatok
Cég: PCMENTOR SZERVIZ KFT.
Város: Budapest