DevProTalk - Molim objasnjene oko razlicitog ponasanja div-ova u IE i FF

DevProTalk (http://www.devprotalk.com/index.php)

- (X)HTML, JavaScript, DHTML, XML, CSS (http://www.devprotalk.com/forumdisplay.php?f=8)

- - Molim objasnjene oko razlicitog ponasanja div-ova u IE i FF (http://www.devprotalk.com/showthread.php?t=6253)

misko_

18. 09. 2008. 12:01

Molim objasnjene oko razlicitog ponasanja div-ova u IE i FF

Cao,

Napravio sam svoj jednostavni webspace, namjerno sam ga napravio tako jednostavnim i zapravo sadrži samo linkove.

I naravno ne izgleda isto na FF i IE, pa pih zamolio da mi netko objasni zasto je to tako, jer sam siguran da ovdje ima onih koji su u tome ispekli zanat.
Koliko sma ja upoznat obično je IE teže natjerati da prikaže onako kako želimo, ali kod mene je IE prikazao onako kako sam zamislio dok me FF malo zezea.

Moja pitanja su sljedeca:
1. Zasto ispod drugoga žutaga kvadrata nema crna crta kao u IE ?
1. Zasto iznad narančastog kvadrata nema crvena crta kao u IE ?

Meni se čini da se ovo ponavlja zbog istog problema ali neznam kojega. Da li je to greška do preglednika ili ja nisam napravio kako bi trebalo ?

Hvala na odgovorima...

Ovo je prilog slike kako izgleda u IE

Kako izgleda u FF i Operi

krcko

18. 09. 2008. 12:31

pa kako neko moze da ti pomogne ako nisi stavio ni parce css/html koda?

to da ie prikaze lepo a normalni browseri lose je veoma cesto kada si pocetnik i kada razvijas sajt za internet explorer pa tek onda gledas u ostalim browserima.

znaci, da da vidimo css/html pa cemo da ti pomognemo, jer ovako bez koda mozemo samo da nagadjamo...

btw imas jednu gresku u spellovanju, Croatian a ne Croatina

misko_

18. 09. 2008. 13:07

Citat:

Originalno napisao krcko (Napišite 60672)

sorry

Odes na http://buklijas.info/ i pogledas source, jako je jednostavno
a css je na http://buklijas.info/main.css

Alex_SD

18. 09. 2008. 14:11

Ovo radi u Firefoxu (nisam probao u Exploreru, probaj pa nam javi)

Kôd:

<div id="main">

        

            <div id="header_shape">

                <div id="header">

                    <h1>Saša Buklijaš</h1>

                </div> 

            </div> 

            <div id="content_shape">

                    <div id="cro">

                <a href="http://www.linkedin.com/pub/2/51A/394">Moj profil na LinkedIn</a>.<br>

                <a href="http://mzsl.wordpress.com/">Blog o životu sa linux-om.</a><br>

                <a href="http://buklijas.info/cv/Sasa_Buklijas_CRO.pdf">Životopis.</a>(285KB, pdf)<br>

                    </div>

            

                    <div id="eng">

                <a href="http://www.linkedin.com/pub/2/51A/394">My profile on LinkedIn</a>.<br>

                <a href="http://mzsl.wordpress.com/">Blog abouth life with linux. It is on Croatina.</a><br>

                <a href="http://buklijas.info/cv/Sasa_Buklijas_ENG.pdf">CV.</a>(285KB, pdf)<br>

                    </div>

                                                </div>

        </div>

Videces da sam dodao div #content_shape koji obmotava #cro i #eng.

A evo i izmena u CSS-u:

Kôd:

#header_shape

{

    background-color: red;

    padding: 1em;

    margin: 0;

}

#header

{

    background-color: orange;

    text-align: center;

                padding: 1em;

}

#content_shape {

        padding: 1em;

}

#cro, #eng

{

    padding: 1em; /*koliko je sadržaj udaljen od ruba elementa*/

    background-color:  yellow;

}

#eng

{

    margin-top: 1em;

}

misko_

19. 09. 2008. 09:03

Riješeno

@Alex_SD ovo radi bez problema i na IE i na FF...

Dok sam pokusavao dokuciti koje CSS svojstvo za šta služi, vidio sam da je

Kôd:

#header_shape

{

    background-color: red;

    padding: 1em;

    margin: 0;

}

margin: 0; nepotreban, valjda je podrazumjevani 0 ???
Da li ima neki posebni razlog zasto si ga stavio ?

Meni se čini da je krajni zaključak kod ovih igranja sa div-ovima i CSS-om je da od viša div-a glava ne boli .-)

Pedja

19. 09. 2008. 10:28

Citat:

Originalno napisao misko_ (Napišite 60703)

Meni se čini da je krajni zaključak kod ovih igranja sa div-ovima i CSS-om je da od viša div-a glava ne boli .-)

Ja bas imam drugaciji utisak, da je CSS jos uvek debelo nedoradjena stvar koja ne radi ono zbog cega se svi kunu u njega.

Sve dok, da bi se postigao odredjeni izgled bude morao da se menja HTML, CSS ce biti samo polovino odradjena tehnologija.

Prema ideji CSS-a, neprihvatljivo je da se, zarad postizanja negovog vizuelnog efekta, moraju dodavati div-ovi, jer to znaci da divove stavljamo zarad vizuelnog efekta a ne kao sadrzaj dokumenta.

Ak je ovakvo resenje sa dodavanjem za sadrzaj nepotrebnih div-ova prihvatljivo, onda ne vidim sta ima strasno da covek lepo stavi tabelu i resi isti problem mnogo brze i jednostavnije.

nixa	19. 09. 2008. 10:39

^ dodajes svaki element markup-a ako nemas dovoljno znjanja da resis to na pravilan nacin.

a ovo za tabele ... no comment ....

misko_

19. 09. 2008. 11:01

Citat:

Originalno napisao nixa (Napišite 60705)

^ dodajes svaki element markup-a ako nemas dovoljno znjanja da resis to na pravilan nacin.

Da li bi ti mogao napraviti ovo što sam ja htio sa manje HTML i CSS koda(zanakova) elemenata ?

Nisam stavio ovo pitanje da te provociram, nego bih čisto htio vidjeti da li bi se ovo moje moglo napraviti jednostavnije

Citat:

Ak je ovakvo resenje sa dodavanjem za sadrzaj nepotrebnih div-ova prihvatljivo, onda ne vidim sta ima strasno da covek lepo stavi tabelu i resi isti problem mnogo brze i jednostavnije.

Po mome iskustvu tablice su najgore moguče riješenje pogotovo ako hoćeš nešto na promjeniuš iako izgledaju kao najjednostavnije

nixa	19. 09. 2008. 12:17

Moze .

misko_

19. 09. 2008. 12:37

Citat:

Originalno napisao nixa (Napišite 60715)

Moze .

bili pokazao ?:please:

krcko

19. 09. 2008. 15:57

evo, jel mogu ja? :)

html:

Kôd:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

    <meta http-equiv="content-type" content="text/html; charset=utf-8" />

        <meta http-equiv="content-style-type" content="text/css" />

        <meta http-equiv="imagetoolbar" content="no" />

        <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

        <meta name="MSSmartTagsPreventParsing" content="TRUE" />

    <title>Site name</title>

        <link href="common.css" rel="stylesheet" type="text/css" media="all" />

</head>

<body>

    <div id="page">

                <h1>Sasa Buklijas</h1>

                <div id="infoholder">

                        <ul>

                                <li><a href="">Moj profil na LinkedIn</a>.</li>

                                <li><a href="">Blog o zivotu sa linux-om</a>.</li>

                                <li><a href="">Zivotopis</a>. (285KB, pdf)</li>

                        </ul>

                        <ul class="last-child"> <!-- ova klasa je potrebna za ie6 -->

                                <li><a href="">My profile on LinkedIn</a>.</li>

                                <li><a href="">Blog about life with linux. Is is on Croatian</a>.</li>

                                <li><a href="">CV</a>. (285KB, pdf)</li>

                        </ul>

                </div>

        </div>

</body>

</html>

css:

Kôd:

body,input{font-family:serif;color:#000;background:#fff;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup,sub{line-height:-1px;vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}h1{font-size:138.5%;}h2{font-size:123.1%;}h3{font-size:108%;}h1,h2,h3{margin:1em 0;}h1,h2,h3,h4,h5,h6,strong{font-weight:bold;}abbr,acronym{border-bottom:1px dotted #000;cursor:help;}em{font-style:italic;}blockquote,ul,ol,dl{margin:1em;}ol,ul,dl{margin-left:2em;}ol li{list-style: decimal outside;}ul li{list-style: disc outside;}dl dd{margin-left:1em;}th,td {border:1px solid #000;padding:.5em;}th{font-weight:bold;text-align:center;}caption{margin-bottom:.5em;text-align:center;}p,fieldset,table{margin-bottom:1em;}





body

{

        background: url(img/bg.png) repeat;

        font-size: 10px;

}



#page

{

        width: 80%;

        margin: 0 auto;

        font-size: 2.4em;

        text-align: center;

        padding-top: 2em;

}



h1

{

        background: orange;

        border: .5em solid red;

        padding: .7em;

        font-size: 2.1em;

        margin-bottom: 0;

}



#infoholder

{

        background: black;

        text-align: left;

        padding: 1em;

}



#infoholder ul

{

        margin: 0;

        padding: 1em;

        background: yellow;

        margin-bottom: 1em;

}



#infoholder ul:last-child,

#infoholder ul.last-child  /* ie6 ne podrzava :last-child selector */

{

        margin-bottom: 0;

}



#infoholder ul li { list-style-type: none; }

nixa	19. 09. 2008. 16:25

hvala kolega :)

krcko

19. 09. 2008. 17:06

molim i drugi put :)

Pedja

19. 09. 2008. 19:52

Citat:

Originalno napisao nixa (Napišite 60705)

a ovo za tabele ... no comment ....

Ma da, kad nemas argumetn onda no comment

Klasika.... :1082:

bluesman

19. 09. 2008. 20:08

Pedja, da ne idemo u offtopic, koji je tvoj argument "za tabele" ? Mozemo da pokrenemo i novu temu ako hoces "tabele vs css, za i protiv". Bas me interesuju tvoji razlozi.

nixa	19. 09. 2008. 21:15

pa relativno je prosto bluesman, znaci moze covek da dodje kod mene u firmu, da ga stavimo za jedan racunar, damo mu editor i layout i za drugim racunarom ce da se radi isti layout .... moze da se ceo event snimi, i moze da se stavi neka opklada iza toga ...

ja sam prilicno uveren ko ce da prvi zavrsi, ako je i on siguran isto ... poziv je otvoren .

ja imam argumente, ali ne gubim vreme objasnjavajuci ljudima no-brainer

Pedja

21. 09. 2008. 03:25

Citat:

Originalno napisao bluesman (Napišite 60744)

Pedja, da ne idemo u offtopic, koji je tvoj argument "za tabele" ? Mozemo da pokrenemo i novu temu ako hoces "tabele vs css, za i protiv". Bas me interesuju tvoji razlozi.

Nisam ni rekao da ja zagovaram tabele, vec sam rekao da s obzirom da CSS ionako ne moze da ispostuje principe koji su glavna argumentacija da se ne koriste tabele, onda ne vidim zasto bi se neko cimao i oko toga da li da koristi tabele ili ne, kad mu dodje na isto.

Ako je nesto lakse i brze zavrsiti tabelom, onda ne vidim problem da se to tako i uradi, posto to nije nista "strasnije" nego trpati div-ove koji su inace nepotrebni, samo da bi se postigao odredjeni izgled dokumenta, naoricto ako uz takav div idu i razni IE hakovi, Mozilla hakovi, MAC hakovi, Opera hakovi i sve sto je sasvim redovna pojava u web kodiranju danas.

Citat:

Originalno napisao nixa

ja imam argumente, ali ne gubim vreme objasnjavajuci ljudima no-brainer

Mozes li ovo da prevedes na srpski posto mi nije jasno sta si mislio ovako nakaradno sklopljenom recenicom?

nixa	21. 09. 2008. 15:48

Evo da ti prevedem na srpski.

Osoba koja u danasnje vreme kaze da je produktivnija sa tabelama u poredjenju sa xhtml/css ocigledno ne zna o cemu prica i ne moze da se shvati ozbiljno, a jos manje kao profesionalac.

Ako ti kazes drugacije, imas poziv gore pa mozemo da organizujemo .

bluesman

21. 09. 2008. 16:16

Citat:

Originalno napisao Pedja (Napišite 60819)

Ako je nesto lakse i brze zavrsiti tabelom, onda ne vidim problem da se to tako i uradi, posto to nije nista "strasnije" nego trpati div-ove koji su inace nepotrebni, samo da bi se postigao odredjeni izgled dokumenta, naoricto ako uz takav div idu i razni IE hakovi, Mozilla hakovi, MAC hakovi, Opera hakovi i sve sto je sasvim redovna pojava u web kodiranju danas.

Ja na ovo nemam komentar posto iskreno mislim da ti ne znas o cemu govoris i bila bi uzaludna bilo kakva diskusija sa nekim ko mislim da je "nepotrebno koristiti css samo da bi se postigao odredjeni izgled dokumenta". Nemam ni zelju a ni vremena da ulazim u beskorisne diskusije.

Pedja

21. 09. 2008. 18:43

Citat:

Originalno napisao nixa (Napišite 60833)

Nixa, ostavi ti to podmetanje z aneku drugu pricu. Za to si uvek spreman i rad. Ovo sto mi stavljas u usta ja NISAM rekao.

Ali sta mozemo ti si ovde admin pa ti se moze da radis sta hoces, jer ces uvek proci nekaznjeno.

STo se tice takmicenja, ja upravo zelim da te bar jednom vidim da pored "no comment" , prevrtanaj ocima i slicnih stvari kojima bogato odslikavas soju nemogucnost da se izrazis, ovde naforumu pokazes sto to kao navodno znas. Tvoaj prepotentnost i nadmenost je ocita ali konkretnih argumenata koji ti daju za pravo takvo ponasanje nemas.

Ja sam davno prevazisao tu decacku potrebu dokazivanja, nema nikakvu potrebu da se ikme dokazujem, a pogotovo ne tebi, koji si daleko ispod mog nivoa, pre svega u vaspitanju i ponasanju, a onda i u svemu ostalom.

Citat:

Originalno napisao Bluesman

bila bi uzaludna bilo kakva diskusija sa nekim ko mislim da je "nepotrebno koristiti css samo da bi se postigao odredjeni izgled dokumenta".

Ja nisam rekao nista ni blizu tome da je "nepotrebno koristiti css samo da bi se postigao odredjeni izgled dokumenta".

Cak nisam ni govorio o CSS nego i DIV. Slozices se valjda da je to velika razlika.

Je l' to ovde postalo uobicajeno da se sagovorniku stavlja u usta ono sto nije rekao da bi se imalo dovoljno razloga za njegovo ponizavanje?

Od Nikse to mogu da razumem, to je njegov nivo uvek i bio, ali ti si bar do sada uglavnom bio ozbiljan i zreo sagovornik.

nixa	21. 09. 2008. 19:27

Pa okej Pedja, ako kazes da sam ti ja nesto "podmenuo" , lepo se izrazi sta si mislio da kazes i sve je ok ... pogresi covek.

Znaci ako si mislio da kazes da je tabela prava za prikazivanje tabelarnih podataka dok sve ostalo ima svoj zaseban markup ...

Objasni tačno šta si mislio, po mogućnošću sa primerima.

bluesman

21. 09. 2008. 21:37

Cekaj bre Pedja, sad ce biti da sam lud i ne znam sta si napisao? Sad ti mozes da pricas da sam ja bezobrazan i da koristim to sto sam admin pa mogu da ti kazem sta hocu bez posledica, ali veruj mi da sam jako odmeren kada ti kazem da je ovo:

Citat:

izuzetno los stav koji pokazuje osnovno nepoznavanje tehnologije o kojoj govoris.

Dakle, necu uopste da se nastavljam, nema svrhe da te ubedjujem niti da slusam ovakve tvoje stavove.

misko_

22. 09. 2008. 07:32

Ja ovu Vašu prepisku vidim na ovaj način...

Puno je lakše početniku napraviti stranicu uz pomoč tablica, nego sa CSS-om...

Ja znam neke ljude koji sebe nazivaju webmasjtorima a prave tablice u dreamweaver, otvore ga i onda u GUI-u nacrataju si par tablica, ja sam jendom pokušao dodati par linia PHP koda u tako što i mogu reči da je to nočna mora, na kraju sam ja skucao neki layout sa CSS-om jer mio se više nije dalo ulaziti u 3 nivoa tablica...

Ja kada idem napraviti neki layout mi ga je draže napraviti sa CSS-om jer to vidim kao veći izazov, nikada mi ništa ne radi onako kako sam zamislio i svaki put vidim nešto novo.

Netkome tko svaki dan pravi stranice mu se više isplati naučiti CSS i raditi sa tim...

Tako da nije pravo pitanje što je bolje?
Nego što je za koga bolje ?

borstale

22. 09. 2008. 08:16

Citat:

Originalno napisao misko_ (Napišite 60870)

Puno je lakše početniku napraviti stranicu uz pomoč tablica, nego sa CSS-om...

Samo ako je pogrešno naučen. Odnosno, ako na osnovu onoga iz čega uči stvori u glavi sliku web stranice kao veliku tabelu sa gomilom tabela u njoj.
Ako u glavi ima sliku stranice koja se sastoji od slojeva onda mu je lakše tako i da je napravi.

krcko

22. 09. 2008. 13:25

evo ja sam prvo poceo da radim sa tabelama jer su mi tako pokazali, napravio sam dva-tri lejauta i uzeo (tada) lepe pare. e onda su dolazili malo komplikovaniji lejauti koji jednostavno nisu mogli da se urade pomocu tabela, zato sam onda poceo da citam o tom tableless dizajnu i u pocetku mi se ucinilo dosta komplikovano i sporo... i jeste bilo sporo (ali ne mnogo komplikovano) ali kada sam uradio 5-6 razlicitih lejautova bez i jedne jedine tabele (osim tamo gde je trebalo tabelarno prikazati podatke) shvatio sam koliko je zapravo brze i lakse napraviti lejaut bez tabela (a o lakoci odrzavanja i nadogradjivanja da i ne pricam).

naravno, jednom kad se prebacite na tableless videcete koliko tu ima razlika u browserima (pogotvo ie6 vs others) ali i to se relativno brzo savlada... evo ja vec 2 godine pravim samo tableless lejautove i u 90% slucajeva mogu da napravi cross-browser lejaut "iz prve" tj da razvijam lejaut samo na jednom browseru (firefox) imajuci na umu nedostatke i razlike ostalih browsera (uglavnom ie6) i da lejaut radi u svim browserima bez dodatnog "hakovanja"...

nixa	22. 09. 2008. 13:30

pored toga sto je na kraju lakse preko tabeless , ide sa svim standardima od renderinga do odrzavanja ... sve u svemu , pravi je bizar da mi sada uopste ubedjujemo ikoga da je to bolje ili lose :|

krcko

22. 09. 2008. 15:09

^ i pogotovu sto je i ovde pedja taj koji uporno tvrdi da je tableless los/komplikovan/spor/sta-vec a i na esu je relativno skoro dobio isti odgovor...

twix	22. 09. 2008. 19:58

Off Topic: krcko jel to bese pre 5-6 godina, kad sam ti radio personal website ;)

krcko

22. 09. 2008. 21:39

^egzakli twix :)

Vreme je GMT +2. Trenutno vreme je 13:52.

Mišljenja, saveti, izjave, ponude ili druge informacije ili sadržaji nastali na Sajtu su vlasništvo onoga ko ih je kreirao, a ne DevProTalk.com, tako da ne morate da se oslanjate na njih.
Autori poruka su jedini odgovorni za ovakve sadržaje. DevProTalk.com ne garantuje tačnost, kompletnost ili upotrebnu vrednost informacija, stavova, saveta ili datih izjava. Ne postoje uslovi pod kojima bi mi bili odgovorni za štetu ili gubitak koji je posledica bilo čijeg oslanjanja na nepouzdane informacije, ili bilo kakve informacije nastale kroz komunikaciju između registrovanih članova.
Web sajt može sadržavati linkove na druge web sajtove na Internetu ili neke druge sadržaje. Ne kontrolišemo niti podržavamo te druge web sajtove, niti smo pregledali bilo kakve sadržaje na takvim sajtovima. Mi nećemo biti odgovorni za legalnost, tačnost ili prikladnost bilo kog sadržaja, oglasa, proizvoda, usluga ili informacije lociranim na ili distribuiranih kroz druge web sajtove, niti za bilo kakvu štetu nastalu kao posledica takvih informacija. DevProTalk.com drži i čuva druga prava vlasništva na web sajtu. Web sajt sadrže materijale zaštićene copyright-om, zaštitne znakove i druge informacije o pravu vlasništva ili softver. Članovi mogu poslatu informacije zaštićene pravima vlasništva njihovih nosilaca i ona ostaju zaštićena bez obzira da li su oni koji prenose te informacije to naveli ili ne. Osim informacija koje su u javnom vlasništvu ili za koje dobijete dozvolu, nemate pravo da kopirate, modifikujete ili na bilo koji način menjate, objavljujete, prenosite, distribuirate, izvršavate, prikazujete ili prodajte bilo koju informaciju zaštićenu pravima vlasništva. Slanjem informacija ili sadržaja na bilo koji deo DevProTalk.com, Vi automatski dozvoljavate i predstavljate garanciju da imate pravo da dozvolite DevProTalk.com ili članovima DevProTalk.com bespovratnu, kontinualnu, neograničenu, globalnu dozvolu da koriste, kopiraju, izvršavaju, prikazuju i distribuiraju takve informacije i sadržaje i da iz takvih sadžaja koriste bilo koji deo u bilo koje svrhe, kao i pravo i dozvolu da koriste gore navedene sadržaje. Svi zaštitni znakovi (trademarks), logotipi, oznake usluga, firme ili imena proizvoda koji se pominju na ovom web sajtu su vlasništvo kojim raspolažu njihovi vlasnici.