Forum » Izdelava spletišč » Čuden margin v IEju
Čuden margin v IEju
Ziga Dolhar ::
V html sem vstavil nek kontejnerski objekt, vanj pa dva objekta, ki imata nastavljen float: left in margin-left: 10px;.
V Firefoxu dela vse bp; v IEju pa se pojavi težava, da izriše levi margin "levega elementa" (prvega div-a) dvojno: torej, če je nastavljen na 1px, ga izriše še enkrat širšega od desnega elementa, če 10px pa kar 20px.
Tech-demo
V čem bi lahko bila težava? (In rešitev, ki po možnosti ni določanje padding-left nosilnemu objektu).
V Firefoxu dela vse bp; v IEju pa se pojavi težava, da izriše levi margin "levega elementa" (prvega div-a) dvojno: torej, če je nastavljen na 1px, ga izriše še enkrat širšega od desnega elementa, če 10px pa kar 20px.
Tech-demo
V čem bi lahko bila težava? (In rešitev, ki po možnosti ni določanje padding-left nosilnemu objektu).
https://dolhar.si/
Netrunner ::
h.. če bi dal kodo bi ti lahko še kaj pomagal ....tako pa ...
kakorkoli moraš vedet da IE in mozzila razumeta drugače pojem margin in padding .... in okoli tega iz mojih izkušenj imam vedno sranje ... ma vse se da rešit
kakorkoli moraš vedet da IE in mozzila razumeta drugače pojem margin in padding .... in okoli tega iz mojih izkušenj imam vedno sranje ... ma vse se da rešit
Doing nothing is very hard to do... you never know when you're finished.
Ziga Dolhar ::
Saj je koda, celo polinkal sem jo :-).
Pa vseeno:
Pa vseeno:
<div style="width: 500px; background-color: red; clear: both; "> <div style="width: 200px; background: yellow; margin-left: 0px; float: left; ">Bla</div> <div style="width: 200px; background: yellow; margin-left: 0px;float: left; ">Bu</div> <div style="clear: both; "> </div> </div> <div style="width: 500px; background: red; clear: both; "> <div style="width: 200px; background: yellow; margin-left: 1px; float: left; ">Bla</div> <div style="width: 200px; background: yellow; margin-left: 1px; float: left; ">Bu</div> <div style="clear: both; "> </div> </div> <div style="width: 500px; background: red; clear: both; "> <div style="width: 200px; background: yellow; margin-left: 10px; float: left; ">Bla</div> <div style="width: 200px; background: yellow; margin-left: 10px; float: left; ">Bu</div> <div style="clear: both; "> </div> </div>
https://dolhar.si/
Netrunner ::
heh sem spregledal link ....
s CSSjem delam vsaki dan in sem naletel že na kup podobnih problemov ... samo zdej mi prav ne pade na pamet kaj je tukaj narobe ... zanimiv problem ... zdej na delu se nimam časa zjnim ubadat ... doma bom vrgel še eno očke kaj je narobe .... pa ti sporočim
s CSSjem delam vsaki dan in sem naletel že na kup podobnih problemov ... samo zdej mi prav ne pade na pamet kaj je tukaj narobe ... zanimiv problem ... zdej na delu se nimam časa zjnim ubadat ... doma bom vrgel še eno očke kaj je narobe .... pa ti sporočim
Doing nothing is very hard to do... you never know when you're finished.
veteran ::
v IEju pa se pojavi težava, da izriše levi margin "levega elementa" (prvega div-a) dvojno
Verjetno je double float margin bug, star hrošč (mi je že nagajal;).
Tole preglej:
http://www.positioniseverything.net/explorer/doubled-margin.html
Verjetno je double float margin bug, star hrošč (mi je že nagajal;).
Tole preglej:
http://www.positioniseverything.net/explorer/doubled-margin.html
SeTAr ::
take probleme ponavadi rešim tako, da 2x napišem isti rule, s tem da dam najprej tistega od firefoxa in še ! important zraven:
margin-left:10px !important;
margin-left:5px;
margin-left:10px !important;
margin-left:5px;
root987 ::
To je ena izmed možnosti...
Lahko pa narediš IEju lasten CSS in potem tega serviraš sam IEju z "conditional comments", ki jih pozna samo IE.
Ti dam kar iz mojega sourca primer:
Prednost pred !important? Predvsem večja preglednost, IMHO.
P.S. if lte IE 6 -> less or equal (lahko bi dal samo [if IE] ampak bodo morda v IE7 kaj čarali - forward compability)
Lahko pa narediš IEju lasten CSS in potem tega serviraš sam IEju z "conditional comments", ki jih pozna samo IE.
Ti dam kar iz mojega sourca primer:
<!--[if lte IE 6]>
<link rel='stylesheet' type='text/css' href='css/iehack.css'>
<![endif]-->
iehack (zaenkrat):
ul {
height:30px;
}
Preostali dizajn pa IE dopolnjuje z "skupnim" cssom.Prednost pred !important? Predvsem večja preglednost, IMHO.
P.S. if lte IE 6 -> less or equal (lahko bi dal samo [if IE] ampak bodo morda v IE7 kaj čarali - forward compability)
"Myths which are believed in tend to become true."
--- George Orwell
--- George Orwell
Zgodovina sprememb…
- spremenil: root987 ()
Ziga Dolhar ::
Zgornjo težavo sem rešil z display: inline (hvala, veteran!). Serviranje različnih dokumentov se mi ne zdi priročno.
Tudi sicer želim take težave vedno rešit z dodatno deklaracijo ali selektorjem in čim manj ostalega smetenja.
Tudi sicer želim take težave vedno rešit z dodatno deklaracijo ali selektorjem in čim manj ostalega smetenja.
https://dolhar.si/
Vredno ogleda ...
| Tema | Ogledi | Zadnje sporočilo | |
|---|---|---|---|
| Tema | Ogledi | Zadnje sporočilo | |
| ! | Vse, kar ste si želeli vprašati o CSS, pa si niste upali. (strani: 1 2 3 4 … 23 24 25 26 )Oddelek: Izdelava spletišč | 347374 (6511) | sunniegoldie |
| » | HTML in CSS težava pri razporeditvi DIV elementovOddelek: Izdelava spletišč | 978 (798) | MisterR |
| » | CSS problemi (strani: 1 2 )Oddelek: Izdelava spletišč | 9879 (7678) | nuuush |
| » | [CSS]Pozicioniranje footer divaOddelek: Izdelava spletišč | 2467 (2414) | amaze646 |
| » | CSS background-image in IE6?Oddelek: Izdelava spletišč | 3081 (2947) | Road Runner |