View previous topic :: View next topic |
Author |
Message |
nemogirl
Joined: 27 Oct 2004 Posts: 386 Location: istra
|
Posted: 23.05.2005 13:54 Post subject: CSS padding problem |
|
|
evo, prvi put pokusavam u css napravit sajt. tabless.
najvise mi je problema dao taj bezazleni padding
npr.
imam jedan div koji je definirane sirine.. npr. ovako
<div style="width: 400px; padding: 25px; background-color: #A3D9F8;">proba</div>
e sad. u exploreru mi taj div ostaje 400 px sirok, a u firefoxu se padding zbraja sa sirinom i on postaje 450 sirok !?
kako to rijesit??
probala sam stavit overflow: hidden i onda mi je na trenutak proradilo, ali kad sam promjenila neki drugi div - od onda nikako ne mogu natjerat ga da radi kako ja hocu. i to me uvijek firefox zeza.
please, vi css experts, help!
tnx. |
|
|
Back to top |
|
|
keye
Joined: 24 Nov 2003 Posts: 2465 Location: Paris - France
|
Posted: 23.05.2005 14:09 Post subject: |
|
|
stavi u body margin:0px i padding:0px i odredi line-height tako da ti svuda bude isti default.
nakon toga ti je najbolje u taj div opalit jos jedan div sa transparent bg i u njega staviti samo content a odvojiti ga od glavnog diva sa marginom i paddingom.
probaj pa javi |
_________________ Google is a blind person |
|
Back to top |
|
|
zytzagoo mi3.crew
Joined: 25 Aug 2003 Posts: 1842 Location: Zagreb, Hrvatska
|
Posted: 23.05.2005 14:11 Post subject: |
|
|
Imas li definran potpuni DTD na početku tog dokumenta? U quirks mode-u ne želiš započinjati izradu css layouta.
Ovo što opisuješ je koliko me sjećanje služi karakteristično baš za internet explorer, a ne za firefox... Osim ako nisi u quirks modu.
EDIT: http://www.mi3dot.org/forum/viewtopic.php?t=3888 - odlična početna točka za pročitati malo o css-u i svemu što ide uz to... |
|
|
Back to top |
|
|
keye
Joined: 24 Nov 2003 Posts: 2465 Location: Paris - France
|
Posted: 23.05.2005 14:18 Post subject: |
|
|
zytzagoo wrote: |
Ovo što opisuješ je koliko me sjećanje služi karakteristično baš za internet explorer, a ne za firefox... Osim ako nisi u quirks modu.
.. |
zyt ja sam imala slicnu frku nedavno sa dva stupca i u desnom zeza sirina zbog padinga(doc type deklariran of course) i onda sam muljala bas ovako kao gore pa sam uspjela ispaaviti (donekle).
sve kul, dobro sam prucila taj box-model demo ali nemam neko objasnjenje na zasto mi padding ok u prvom stupcu ali ne u drugom (u dva browsera) |
_________________ Google is a blind person |
|
Back to top |
|
|
nemogirl
Joined: 27 Oct 2004 Posts: 386 Location: istra
|
Posted: 23.05.2005 14:32 Post subject: |
|
|
@keye: margine u bodyju su mi na nuli. line-height se isto pokazao nepouzdan pa ga izbjegavam koristit dok ne skuzim u cemu je caka. tako da mi on nigdje nije definiran.
a ovo ostalo... probala sam nesto slicno. ne znam koliko je to pametno, ali sad mi radi.
stavila sam u taj div <span style="position: relative; top 20px; left: 20px; right: 20px; left: 20px">
i tako dobila taj padding bez paddinga, a sirinu sam smanjila za 40 px i dobila tocno sto zelim. imam neki feeling da sam ih prevarila (IE i FF), pa da ce mi to u buducnosti opako vratit... npr. nekim nebuloznim pomicanjem ili...
@zyt: moram priznati da jos ne kuzim bas taj doctype tj. ne znam koji stavit. ono sto sam procitala o tome na netu nije mi bas pomoglo u definiranju. ja koristim <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> konkretno za taj projekt, i ne znam da li ASP ima kakve veze s doctypom jer imam i ASP koda u stranici... |
|
|
Back to top |
|
|
che.UP mi3.crew
Joined: 07 Sep 2003 Posts: 2320 Location: zagreb
|
Posted: 23.05.2005 14:45 Post subject: |
|
|
nemogirl wrote: | ja koristim <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> konkretno za taj projekt, i ne znam da li ASP ima kakve veze s doctypom jer imam i ASP koda u stranici... |
asp nema veze sa doctyeom ali ovaj koji ti koristis nije potpun jer mu fali link na dtd file...
ovo je ispravan za html 4 transitional:
Code: | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"> |
|
_________________ UP | TypeTester | Accommodations App
Meni u Firefox-u ne radi AJAX |
|
Back to top |
|
|
nemogirl
Joined: 27 Oct 2004 Posts: 386 Location: istra
|
Posted: 23.05.2005 14:58 Post subject: |
|
|
@che.up:
ok, ali kakve veze ima taj url link ako ja radim i gledam u stranice offline - kako znam da nisam u quirk modu jer mi je neispravan doctype? i lako ja puknem taj url ali mislim da necu vidjet neku razliku.
@everybody: moze li mi netko reci da li je okej taj nacin kojim sam ja rjesila problem ili ce me kasnije negdje opet zezat jer nisam dobro napravila...?!
drugo pitanje: da li je bed ako postavim jednu tablicu: cisto da mi drzi 2 column design pa da mi bude lakse... ili je ipak daleko bolje potpuno izbacit tablice?
|
|
|
Back to top |
|
|
keye
Joined: 24 Nov 2003 Posts: 2465 Location: Paris - France
|
Posted: 23.05.2005 15:15 Post subject: |
|
|
nemogirl wrote: |
@everybody: moze li mi netko reci da li je okej taj nacin kojim sam ja rjesila problem ili ce me kasnije negdje opet zezat jer nisam dobro napravila...?!
|
ako radi radi
Quote: | drugo pitanje: da li je bed ako postavim jednu tablicu: cisto da mi drzi 2 column design pa da mi bude lakse... ili je ipak daleko bolje potpuno izbacit tablice?
|
gle, transitional html ti podrzava strukturalne tablice dakle slobodno napravi sajt u tablicama ali ako vec ides na tabless nece on nista bolje drzati od divisiona kad ih dobro slozis
u sulijenovim resursima cini mi se imas dosta primjera za 2 i 3 column tabless layouta |
_________________ Google is a blind person |
|
Back to top |
|
|
zytzagoo mi3.crew
Joined: 25 Aug 2003 Posts: 1842 Location: Zagreb, Hrvatska
|
Posted: 23.05.2005 15:50 Post subject: |
|
|
nemogirl wrote: | ok, ali kakve veze ima taj url link ako ja radim i gledam u stranice offline - kako znam da nisam u quirk modu jer mi je neispravan doctype? i lako ja puknem taj url ali mislim da necu vidjet neku razliku. |
Pukni, pa ces vidjeti.
Browser se, ako ne vidi cijeli url (bez obzira jel offline ili online), tj. kompletan i ispravan doctype, baca u quirks mode. I to je razlog tvom problemu sa paddingom.
nemogirl wrote: | @everybody: moze li mi netko reci da li je okej taj nacin kojim sam ja rjesila problem ili ce me kasnije negdje opet zezat jer nisam dobro napravila...?! |
Quirks mode je mode u kojem su rezultati renderinga elemenata nepredvidljivi, i browser "pogađa" što si ti htjela napraviti svojim css deklaracijama. Kad je u strict modeu, onda se ponaša po html i css specifikacijama koje poznaje, i ne pokušava (barem ne bi trebao, jel, IE i dalje pogađa) pogađati.
Quote: | drugo pitanje: da li je bed ako postavim jednu tablicu: cisto da mi drzi 2 column design pa da mi bude lakse... ili je ipak daleko bolje potpuno izbacit tablice? |
Stavi tablicu ako ti se žuri, pa kasnije pokušaj maknuti tablicu i napraviti skroz bez tablica. Ako želiš nešto naučiti, i shvatiti kako stvari funkcioniraju, onda ti ipak preporučam da pokušaš bez tablice. Teže je, ali ima to i svojih prednosti |
|
|
Back to top |
|
|
nemogirl
Joined: 27 Oct 2004 Posts: 386 Location: istra
|
Posted: 23.05.2005 16:09 Post subject: |
|
|
hvala svima na savjetima... need some more
puknula sam onaj doctype: i desilo se ovo:
sad mi taj padding 25px i div od 400 px u oba browsera daju 450 sirok div!?
evo primjer code:
Code: | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<div style="width: 400px; padding: 25px; background-color: #A3D9F8;">proba</div>
</body>
</html> |
zar ne bi taj div trebao biti 400 px?!! |
|
|
Back to top |
|
|
zytzagoo mi3.crew
Joined: 25 Aug 2003 Posts: 1842 Location: Zagreb, Hrvatska
|
|
Back to top |
|
|
|