WN - valign...

WN (https://www.wn.se/forum/index.php)

- Klientsidans teknologier, design och grafik (https://www.wn.se/forum/forumdisplay.php?f=12)

- - valign... (https://www.wn.se/forum/showthread.php?t=30083)

Citat:

Är inte conditional comments enbart för html-filer och inte css?

Jo, det var väl det han menade. Han skrev ju inget annat ;)

Kod:

 

<!--[if IE 6]>

<style type="text/css">

.my-ie6-style {color: blue;}

</style>



<link rel="stylesheet" type="text/css" href="style-ie6.css"/>

<![endif]-->

Citat:

Originally posted by allstars@Jun 24 2008, 10:22

Citat:

Är inte conditional comments enbart för html-filer och inte css?

Jo, det var väl det han menade. Han skrev ju inget annat

Kod:

--if IE 6 style type=text/css .my-ie6-style {color blue;} /style link rel=stylesheet type=text/css href=style-ie6.css/ endif--

Jo, men eftersom jag jobbar i css fil, så undrar jag vad det heter då, så jag vet vbad jag ska söka på :P

Hursom, tack för alla bra svar, hoppas tråden även hjälper några andra i surret av cross-browser css.

Jo, jag menar just det som allstars visade.

Jag brukar ha en main.css med all css för sidan så att den ser bra ut i firefox, någorlunda bra ut i IE 7 och förjävlig ut i IE 6. Sedan så kör jag det här:

Kod:

<!--[if lt IE 7]><link rel="stylesheet" type="text/css" media="all" href="/styles/ie6.css" /><![endif]-->

<!--[if gte IE 7]><link rel="stylesheet" type="text/css" media="all" href="/styles/ie7.css" /><![endif]-->

Då har jag en fil med fulhack för ie 6 och en med fulhack för ie 7. Under tiden som IE 8 bara är i beta-stadiet så är det lika bra att köra med det här längst upp i head:

Kod:

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

Den raden gör så att sidan renderas som IE 7 (samt skickar med IE 7:s user agent). När hela IE 8 har släppts så kommer man förhoppningsvis kunna ha samma CSS som för Firefox. :)

Citat:

Originally posted by grinditwp@Jun 24 2008, 09:30
Av någon anledning så löste sig problemet med att jag lade in:

Kod:

bottom:0px; #bottom:-1px;

...på zebdropdownmenu.

Nu verkar det som Firefox med flera läser bottom 0px och IE tolkar -1px. Inget jag provat förut men av någon anledning testade jag.

Någon som kan förklara detta? hehe

Jag har tyvärr bara IE6, ff3 och safari installerat just nu men med all sannolikhet ska det se bra ut.

Först och främst så är din markup inte nåt att hänga i granen väldigt mycket onödiga taggar, ett bra tips kan vara att just skriva din markup (html) innan du ger dig på CSS'n samt använda list's för din navigering/meny (för det är ju trots allt va det är :D).

iaf IE hanterar paddings tillsammans med absolute positionering lite knas, ett absolute positionerat element känner tyvärr av paddingen av sin container :/, går ju enkelt att fixa till med !important hack, slängde upp ett litet snabbt exempel du kan ta och kika på, hoppas du inte har något imot det.

http://www.iamfake.com/work/kupolium_help/ (kolla, källa)

Sen funkar det så på samma princip som "underscore" och "backslash" hacken, medans modernare webbläsare ignorerar raden så läser IE fortfarande in din #bottom defination. Vet att _bottom (som exempel) inte validerar aldrig brytt mig att ta reda på om bo\ttom gör det.. men att föredra är då att dra till med !important "hacket"(samma princip men tvärtom, IE förstår sig inte på det) istället.