Šta je novo?

DIV poreda DIV pozicionranje

  • Začetnik teme Začetnik teme dj13
  • Datum pokretanja Datum pokretanja
Status
Zatvorena za pisanje odgovora.

dj13

Čuven
Učlanjen(a)
30.01.2002
Poruke
1,112
Poena
715
Imam petlju koja u svakom krugu stampa po 2 DIV. Ono sto hocu da ti div stoje jedan pored drugog horizontalno, a u svaokm novom krugu petlje da se opet ta 2 diva stampaju ispod prethodna 2 opet jedan pored drugog.
Slikovitije receno hocu nesto ko tabelu od X redova i 2 kolone gde su DIV kao TD.
 
<div style="width:400px; overflow:auto; zoom:1">
<div style="width:200px; float:left">prva kolona</div>
<div style="width:200px; float:left">druga kolona</div>
</div>

ove style-ove pretvori u klase, da bi ih lakse manjao, i ovo stavi u petlju, petlju ti nisam pisao jer nisi rekao koji prog. jezik korisitis. Ako ti treba jos neko objasnjenje slobodno pisi. Potrazi na netu knjigu O'Reily CSS missing manual, tamo ti je sve lepo i detaljno objasnjeno, pokriven je cist css, i greske u ie i kako i zaobici.
 
<div style="width:400px; overflow:auto; zoom:1">
<div style="width:200px; float:left">prva kolona</div>
<div style="width:200px; float:left">druga kolona</div>
</div>

ove style-ove pretvori u klase, da bi ih lakse manjao, i ovo stavi u petlju, petlju ti nisam pisao jer nisi rekao koji prog. jezik korisitis. Ako ti treba jos neko objasnjenje slobodno pisi. Potrazi na netu knjigu O'Reily CSS missing manual, tamo ti je sve lepo i detaljno objasnjeno, pokriven je cist css, i greske u ie i kako i zaobici.

To je resenje koje radi. Hvala. Imam skoro sve od O'Reily, i da mi niko nije odgovorio potrzio bi. Ali posto je odgovor bio tacan i brz O'Reily za sledeci put 🙂.
 
Ovo je dobar primer za neke od tipičnih problema zbog kojih se CSS tako sporo širi. Na prvi pogled, DIV boxovi su čak brži i jednostavniji metod od tabela (i jesu!). Ali obratite pažnju, u ovom kratkom kodu gore imamo već i jedno zoom:1. Taj deo koda je potpuno besmislen. Ne, on nije tu greškom, on je tu iz vrlo važnog razloga (kviz pitanje: kojeg?), ali se vidi da u praksi CSS mora biti ispunjen hrpom besmislica da bi valjano radio. To je daleko od dobrog.
 
Ovo je dobar primer za neke od tipičnih problema zbog kojih se CSS tako sporo širi. Na prvi pogled, DIV boxovi su čak brži i jednostavniji metod od tabela (i jesu!). Ali obratite pažnju, u ovom kratkom kodu gore imamo već i jedno zoom:1. Taj deo koda je potpuno besmislen. Ne, on nije tu greškom, on je tu iz vrlo važnog razloga (kviz pitanje: kojeg?), ali se vidi da u praksi CSS mora biti ispunjen hrpom besmislica da bi valjano radio. To je daleko od dobrog.

NIsam shvatio najbolje tvoj komentar, niti njegovu svrhu (ti mozda neznas da pravis ispravan css, da li je to problem).

Ali 'ajde da razjasnimo posetiocima foruma neke stvari, zoom:1 nije standardni atribut u css-u, vezan je samo za IE6, jer IE6 ne poznaje overflow svojstvo. Zoom daje isti rezultat, a sluzi da bi se kontejner koji sadrzi ova dva kontejnera (koji u sebi imaju float svojstvo), rasirio po visini na visinu onog veceg.

Da bi sve ovo bilo slikovitije treba u svaki od ovih kontejnera ubaciti svojstvo background-color sa nekom drugom bojom i izbaci zoom da se vidi kako se ponasa kontejner u ie6 a kako u firefoxu/operi/ie7. takodje bi bilo zgodno izbaciti overflow da se vidi koja je njegova svrha.
 
Vidim da nisi svatio. Jedino mi nije jasno zašto komentarišeš ono što nisi shvatio.

Da li je atribut "zoom" uveden (kao atribut, ne u gornji kod) da bi omogućio overflow svojstvo? Nije! Pa zašto je gore? Upravo zbog toga što ti kažeš. Elem, taj kod jeste potpuno besmislen (posmatraj, zaboga, na nivou sintakse samog CSS-a, zaboravi CSS hackove i IE6 za trenutak), ali ima svrhu, jer kad se ubaci taj besmisleni kod IE6 počne da se ponaša onako kako bi trebalo da se, da je sreće, ponaša i bez njega.

Iskreno se nadam da je tvoje razumevanje CSS-a bolje od tvog razumevanja teksta napisanog na srpskom jeziku.

takodje bi bilo zgodno izbaciti overflow da se vidi koja je njegova svrha.
OK, izbaci ga, pa nas obavesti kakva mu je svrha (screenshotovi više nego dobrodošli). Thanks in advance.
 
Poslednja izmena:
Taj deo oko izbacivanja koda namenjen je dj13 (i svima kojima nije jasno cemu to sluzi), da bi ga naveo da kroz ekperiment sazna cemu ono sto je upotrebio sluzi, da ne bi radio samo copy/paste bez razmisljanja.

To oko besmisla zoom-a je cista filozofija, da su hteli da naprave sve kako treba ispravili bi u ie7, pa nisu. Takodje nije na meni da se pita cemu zoom postoji (i da li smo sami u svemiru), on je tu i odradjuje posao. IE6 je davno napravljen, a nisu nasli za shodno da izbace neku verziju izmedju 6 i 7, i to da isprave, ti hackovi i postoje da bi se napravio jednak css za sve browsere, sto i jeste poenta.

Za moje pokazivanje poznavanja css-a ostaces uskracen, jer nisi nista pomogao ceoveku, nego si samo dao besmislen komentar.
 
Ti izgleda zaista ne znaš zašto je "zoom" atribut uveden. 🙁

A tvoje "poznavanje css-a" je sasvim očigledno iz činjenice da ne znaš čemu služi "overflow" atribut.
 
Poslednja izmena:
Molim moderatora da zakljuca ovu temu, ovo nikud nevodi, wiz011 samo postavlja pitanja, provocira, a ne daje nikakve konstruktivne odgovore.
 
Moje pitanje nije nikakva provokacija, vrlo jasno sam pitao: "kakva je razlika u gornjem kodu sa i bez overflow?" i zamolio da tu razliku ilustruješ screenshot-ovima. Ti deliš ovde nekakve lekcije početnicima, zaključuješ da ja "ne umem da pišem ispravan CSS" (da znaš za koje firme ja pišem CSS i tako zarađujem novac - sam bi se sebi smejao) i od početka se svađaš sa mnom, mada moj prvi post nije imao nikakve veze s tobom, nego sa W3C-om, a ne bih rekao da ti radiš za njih.

Ako s visine ovde dociraš i izigravaš nekakvog profesora i eksperta za CSS, onda u čemu je problem da "lekcije" koje deliš ilustruješ nekim screenshotom? Ili je problem to što screenshotovi ne bi pokazali ama baš nikakvu razliku sa i bez overflow?
 
Vidim ovu raspravu pa ajd bas tebe da pitam koja je svrha zoom-a po tvom?...i ti radis za velike novce i jos vece firme?...treba da ti oduzmu od plate...prosto i jednostavno overflow:auto; sluzi kod mozile da rasiri kontejner po visini ukoliko nije navedena fiksna visina npr height="50px"...ako ne stavis ni jedno ni drugo visina kontejnra,u ovom slucaju <div style="width:400px; overflow:auto; zoom:1"> ce biti samo  ...isto ovo vazi za ie sa zoom:1...manje vise,zoom:1 nije standardan tag kao sto ti je zmaj napisao...i resava neke probleme pod ie6....tvoja recenica "taj kod jeste potpuno,besmislen ali ima svrhu" je malo sam po sebi kontradiktoran kao i ti sa svojim duhovitim dobacivanja.....namesti sebi screenshot pa ces videti..
 
Jel ja pišem kineski, ili šta? Rekao sam da je svrha zoom-a tačno ono što je i Glupi Zmaj rekao da jeste:

Pa zašto je gore? Upravo zbog toga što ti kažeš.
Ja stvarno više ne znam kojim jezikom da pišem a da bi vi razumeli "šta je pisac hteo da kaže". Jedno je sintaksa i semantika samog koda (gde je "zoom: 1" na ovom mestu potpuno besmislen), a drugo je to što IE6 počne ispravno da interpretira ostatak koda kad se doda to "zoom: 1" (zaboga, pa "zoom: 1" znači "ostavi kako jeste").

Iz sličnih razloga se koristi kod DIV elemanata "display: inline". Da li ti zaista misliš da je dodeljivanje "inline" svojstva nečemu što može biti samo block element smisleno na nivou koda?

Zaboga, gledajte na CSS kao na jezik, zaboravite na IE6, na hackove, na bagove, na čuda... Pričam na nivou čistog jezika, standarda, norme, definicije... To je nivo gde se određuje je li kod sintaksno i semantički smislen ili nije, a ne bagovito ponašanje IE6.

Uzmi rečenicu "fghsjhkid jahbdmn bsjdno". Na nivou srpskog jezika ta rečenica je potpuno besmislena. Ali, ako je to moj password za Benchmark onda ta rečenica ima svrhu. Slično je i sa "zoom:1". Problem je što vi očigledno ne shvatate razliku između same "jezičke norme" (u ovom slučaju norme CSS-a) i praktičnog dovijanja.
 
Poslednja izmena:
Moje pitanje nije nikakva provokacija, vrlo jasno sam pitao: "kakva je razlika u gornjem kodu sa i bez overflow?" .....
Ili je problem to što screenshotovi ne bi pokazali ama baš nikakvu razliku sa i bez overflow?

Sa ovim sadrzajem(dve reci) ne bi bilo razlike.
Ali ima bitne razlike jer default rendering(bez ikakvog overflow-a) je "visible"
(sadrzaj izlazi izvan kontejnera u "normalnim" browserima ili rastura layout u "nenormalnom"),
dok "auto" ubacuje scroll-bar ako je sadrzaj veci od kontejnera u kom se nalazi.
http://www.w3schools.com/css/pr_pos_overflow.asp

Medjutim,dodaj jos samo par reci(jos bolje neki malo veci URL,sliku) i dobices raspad layouta u IE,jer ovaj ce ti rasiriti 1. div ma sta ti stavio da ugura sadrzaj u njega,pa ce onda ovaj drugi float,nemajuci mesta otici ispod.
http://www.positioniseverything.net/explorer/expandingboxbug.html
@vuckozr
Nece biti bas tako,pogledaj gore

@Glupi Zmaj
Ni ja ne vidim nikakvu svrhu za Zoom:1 u ovom slucaju,za razliku od overflow.
U svakom slucaju raspad u IE "ne gine" za sadrzaj koji nemoze da stane u kontejner.
Verujem da si pisao ovaj CSS inline zbog prakticnosti da bi mu bilo jasnije sta-kako,samo si trebao napomenuti da prebaci to posle napolje.
Trebao si mu i napomenuti da ovo sto si mu napisao radi(kako treba) samo u ogranicnim slucajevima(koje sam gore naveo),jer si mu mozda na ovaj nacin ucinio "medvedju uslugu"(kad krene layout da mu se raspada,a on nezna zasto,jer je "radilo")

@Glupi Zmaj
ti si prso ko lajsna
@wiz011
A ti imaš sasvim odgovarajući nick.

Ovo nema smisla i nije u redu,a nije ni CSS niti HTML(ako bas morate PM jedan drugoga)

Dechaci 😀
bez vredjanja 😉

Pretece me :type: ,taman podjoh na da kliknem na uzvicnik 😉
 
Poslednja izmena od urednika:
Imam petlju koja u svakom krugu stampa po 2 DIV. Ono sto hocu da ti div stoje jedan pored drugog horizontalno, a u svaokm novom krugu petlje da se opet ta 2 diva stampaju ispod prethodna 2 opet jedan pored drugog.
Slikovitije receno hocu nesto ko tabelu od X redova i 2 kolone gde su DIV kao TD.

Ovo je bilo pitanje, ja neznam koliko ce sadrzaja i kakvog biti stavljeno, kod koji sam dao je pisan na osnovu licnog iskustva, da li ce njemu trebati, da to bude sirine 200px ili sire, nije moje da razmisljam. Napisao sam primer koji ce raditi, takodje ako neko pravi stranu nece praviti tako da u kontejner sirine 200px ugura sadrzaj od 300px jer to samo sebi nema svrhu. Naravno da ovaj kod nema svrhu za jedan red, ali kad ima vise teksta, (slika, drugih kontejnera), moze da dodje do raspada u ie6, zato treba znati sta su bagovi IE i kako ih zaobici, jer i dalje 80% ljudi koristi ie.

Price o tome da li je zoom besmislen ili ne su same po sebi besmislene, MS je napravio ie pre nekoliko godina, i on sa svojim manama je takava kakav je, dizajner (tj onaj koji pravi stranicu) mora da zna kako da namesti kod koji je kompatibilan sa svim browserima.

MS je poznat po tome da se trudi da nametne standarde, pa je valjda pokusao i sa ovim. A mozda nemaju kvalitetnih programera koji znaju da nameste dobar parser za css, pa im je ovo resenje bilo brze. To sto sa strane jezika (CSS) ne postoji u zvanicnoj specifikaciji meni nista ne znaci, i zato me je i "pogodio komentar", cemu u opste komentar, kad nema svoj smisao sem na nekom filozofskom nivou.
 
Sa ovim sadrzajem(dve reci) ne bi bilo razlike.
Ali ima bitne razlike jer default rendering(bez ikakvog overflow-a) je "visible"
(sadrzaj izlazi izvan kontejnera u "normalnim" browserima ili rastura layout u "nenormalnom")
Znam da ima razlike, zato sve vreme i insistiram na tome jer je čoveku rekao "ubaci boju da vidiš razliku". I šta će videti? Neće videti ništa jer u konkretnom primeru nema razlike. Ako nekom daješ savete daj mu savete do kraja.

Trebao si mu i napomenuti da ovo sto si mu napisao radi(kako treba) samo u ogranicnim slucajevima(koje sam gore naveo),jer si mu mozda na ovaj nacin ucinio "medvedju uslugu"(kad krene layout da mu se raspada,a on nezna zasto,jer je "radilo")")
Moja sva iskustva govore da je bezmalo svako korišćenje gotovih rešenja medveđa usluga. Jedno od mojih najgorih iskustava je bilo kodiranje prilično komplikovanog templejta, a ja sam "da uštedim vreme" pokupio odnekud osnovni layout. Posle vrlo napornog rada sve završeno, izgleda savršeno, krenem da testiram i vidim da se u nekim slučajevima layout raspada. Ne znam šta ću, izbezumio se, bio sam na ivici da krenem sa kodiranjem od nule (a već sam bio skoro prekoračio rokove). Onda sam se malo smirio, popio kafu, pogledao kod i brzo rešio problem. Baš kao i ovde, layout koji sam pokupio je savršeno radio za neke ograničene slučajeve, ali inkorporiran u nešto komplikovanije... Uf.

Ni ja ne vidim nikakvu svrhu za Zoom:1 u ovom slucaju")
Uh, šta sam dočekao, da sad ja branim ZOOM:1. Problem je u tome što IE6 neke elemente jednostavno smešta izvan layout-a sve dok im se ne dodeli neko od svojstava za koje se u praksi pokazalo da normalizuju renderovanje u IE6. Npr. za float elemente je preporučljivo dodati (takođe po sebi besmisleno) "display: inline;" (neki preporučuju "inline-table"). Ne znam 100% za konkretan slučaj, nemam IE6 da probam.

Ja ne volim CSS hackove i kad god mogu koristim conditional comments da sredim stvar za problematične verzije IE. Nevolja je to što nema načina da se ovako razdvoje verzije za Mac i Win, a često ista verzija IE-a ne renderuje isto na obe platforme. Naravno, nemam ni Mac da testiram. Pa šta radim? Ništa, upalim sveću i pomolim se da će raditi. :d

A to oko nametanja standarda... Jeste, MS je pokušao da nametne svoja rešenja (mada ne mislim da je o tome reč sa ZOOM:1, to je čist bag u IE6), ali za to veću krivicu snosi W3C nego MS, njihova CSS specifikacija je konfuzna, nelogična i promašena u mnogim slučajevima. MS je ponekad primenjivao bolja rešenja od originalnih, verujući da je dovoljno jak da ih nametne. Da je IE ostao onako rasprostranjen kao ranije tako bi i bilo. Ovako smo dobili haos. Ali, da je W3C ponudio bolje rešenje to se ne bi ni desilo, to rešenje bi implementirao i MS.

@Crni

Pa sam je izabrao nick, šta je uvredljivo u tome što sam pohvalio njegov izbor? :d
 
Price o tome da li je zoom besmislen ili ne su same po sebi besmislene, MS je napravio ie pre nekoliko godina, i on sa svojim manama je takava kakav je, dizajner (tj onaj koji pravi stranicu) mora da zna kako da namesti kod koji je kompatibilan sa svim browserima.

Ne bih se slozio da je prica o zoom-u u css-u besmislena(naravno zavisi od price i argumenata upotrebljenih u njoj) .
zoom:1 u kodu koji si naveo nece nista uraditi osim sto ce uciniti kod invalidnim i zato je njegovo koristenje besmisleno(zoom:2 bi mozda i imalo nekog smisla).
Neko drugi je izmislio taj internet pre malo vise godina nego sto je MS napravio IE.Takodje je osnovao organizaciju da bi omogucio sto bolje funkcionisanje i sprecio nastajanje haosa na istom.
U tu svrhu su usvojeni standardi kao,uostalom,u svim ostalim granama nauke i industrije,ne da bi neko filozofirao nego da bi se ljudima kojih se ti standardi ticu olaksao zivot.
Na zalost uvek se nadje neko ko zbog vlastitih sebicnih ciljeva odluci da pokusa da nametne neki svoj "standard",sto skoro po pravilu uvek stvori velike probleme vecem ili manjem broju ljudi.
Zar ti ne bi voleo da ne moras da hakujes nesto svaki put iznova kad god se pojavi neki novi browser koji ne postuje standarde,ali je eto nesretnim spletom okolnosti zastupljen u velikom procentu?
 
@Crni
Pa sam je izabrao nick, šta je uvredljivo u tome što sam pohvalio njegov izbor? :d
A ti to u fazonu ko priznaje, 1/2 mu se dodaje? 😀

Medjutim, nick jeste bio njegov izbor, ali tvoj komentar nije bio izrechen u shali :smash:
Ok, ne slazete se u misljenjima, ali se to resava argumentima, a ne vredjanjem 😉
Nekad bre previse licno shvatate neke komentare :S:
Samo opusteno i argumentovano :eyebrows:
 
Uh, šta sam dočekao, da sad ja branim ZOOM:1. Problem je u tome što IE6 neke elemente jednostavno smešta izvan layout-a sve dok im se ne dodeli neko od svojstava za koje se u praksi pokazalo da normalizuju renderovanje u IE6. Npr. za float elemente je preporučljivo dodati (takođe po sebi besmisleno) "display: inline;" (neki preporučuju "inline-table"). Ne znam 100% za konkretan slučaj, nemam IE6 da probam.

Ja napisah: u ovom slucaju

Ja ne volim CSS hackove i kad god mogu koristim conditional comments da sredim stvar za problematične verzije IE. Nevolja je to što nema načina da se ovako razdvoje verzije za Mac i Win, a često ista verzija IE-a ne renderuje isto na obe platforme. Naravno, nemam ni Mac da testiram. Pa šta radim? Ništa, upalim sveću i pomolim se da će raditi. :d

Ma ja ih obozavam :crash: 😉 .A tek to vezano za platforme sto volim 😡 .
U tom i jeste poenta postovanja standarda,ma kakvi oni bili u tom momentu.Jer W3C kakav god bio je jako puno vremena izgubio baveci se/sanirajuci netscape/ie/transitional stvari.

Ajde sto ce se tebi/meni G Zmaju skrsiti layout u Safariju ili IE for Mac,nego se (amerima) raspadju sonde/sateliti od Mars zato sto je neki tamo "bas me briga za standarde" lik u NASA-i umesto standardnih metara koristio jarde :lupko: .
 
U tom i jeste poenta postovanja standarda,ma kakvi oni bili u tom momentu.Jer W3C kakav god bio je jako puno vremena izgubio baveci se/sanirajuci netscape/ie/transitional stvari.
Da, ali s druge strane ti imaš naručioca koji s pravom očekuje da mu sve lepo radi i ne možeš da mu kažeš "Ja sam poštovao standarde, a ti menjaj browser".

Problem sa hackovima je to što mi znamo kako se oni ponašaju na postojećim verzijama browsera, ali niko ne zna šta će biti sa nekom sledećom verzijom, tu nešto što je "ispravljalo grešku" može sve totalno da rasturi.

Ja ću ti navesti jedan primer... Ako su < i > zamenjeni sa & lt; i & gt; u nekom JavaScriptu takav script će izvršiti Opera, IE i FF pre verzije 2.x, ali FF 2.x neće. Konkretno, ovo se dešava u jednom scriptu koji se naširoko koristi za redirekciju sa Googlepages default strane na index.html stranu. Googlepages uvek <> zameni sa & lt; i & gt; u on-line editoru i nema načina da se ubaci korektan script. E pa do FF-a 2.x to je radilo u svim browserima, više ne radi.
 
Da, ali s druge strane ti imaš naručioca koji s pravom očekuje da mu sve lepo radi i ne možeš da mu kažeš "Ja sam poštovao standarde, a ti menjaj browser".
Nisam mislio na nas kojima je to "u opisu radnog mesta", nego na ove koji su nas do toga doveli,da ti se dobar deo posla sastoji u prilagodjavanju uradjenog svim aktuelnim browserima.
 
A zamisli, pojavi se IE8 i svi sajtovi sa hackovima se u njemu raspadnu... WOW! Pare ću da namlatim, ima da otvorim firmu za popravku rasturenih sajtova, samo napravim dobar search & replace script - pa udri: 100$ po sajtu, 500 popravljenih sajtova na dan... :d

Evo, mogu odmah da ponudim i dil nekome iz M$-a, vi napravite vrljavi IE8 pa delimo pare fifti - fifti. 😛
 
Poslednja izmena:
Mislim da je DJ13 dobio odgovor na pitanje vec u prvom reply-u, tako da je vase prepucavanje 'ko zna vise' totalno suvisno. Ako hocete da se pokazete na delu uvek mogu da vam dam zadatak da mi odradite nesto kad vec imam problema sa ovim stvarima 🙂 pa ko prvi nadje foru bolji je 🙂
 
Nema problema, ali uz zadatak reci i koliko plaćaš. Znaš, otkako sam ušao u neke godine obično ne rešavam "zadatke" for free. :smoke:
 
Ti si nas idol. Dzizs...

Closed.
 
Status
Zatvorena za pisanje odgovora.
Nazad
Vrh Dno