inläsning av CSS-fil och IE-mac

Tråden skapades och har fått 14 svar. Det senaste inlägget skrevs .
1
  • Medlem
  • Stockholm
  • 2004-03-09 20:39

Jag har skrivit en snutt css-kod som designar upp ett formulär snyggt. Fungerar utmärkt i mozilla, safari och IE-mac.

Sen när jag skulle flytta koden till den skarpa sidan så fungerar inte längre koden för IE-mac, men för övriga.

Den enda skillnad jag kan komma på är att formuläret nu ligger innästlat i en tabell samt att css-koden nu läses in från fil istället för att ligga deklarerad överst i samma dokument.

Har provat deklarera koden överst i samma dokument hos den skarpa versionen och då fungerar det.

Alltså verkar problemet ligga i att läsa in designkoden från fil.
Snälla,säg att någon av er vet vad problemet är.
Kan inte IE-mac läsa in css-kod från fil?? Grrrrr

UPDATE: eEEEEeeeHHHH, efter att ha haft koden liggandes högst upp i samma dokument och sedan flyttat bort de så verkar IE-mac förstå koden som ligger på filen. Hur sjukt är inte det här???

Så här ser koden ut som inkluderar filen (ligger mellan head-taggen)
<link rel="stylesheet" href="include/style.css" type="text/css">

så här ser css-koden ut (som ligger på fil)

body {
	padding: 0px;
	margin: 0px;
	
	background-color: white;
	
	font-family: verdana, geneva, arial, sans-serif;
	font-size: 11px;
}
a:link,a:visited,a:hover {
	color: rgb(0,0,0);
	text-decoration: underline;
}
a:hover {
	text-decoration: none;
}
a:active {
    color:rgb(0,0,0);
	text-decoration: underline;
}

td {
	font-family: verdana, geneva, arial, sans-serif;
	font-size: 11px;
}

h1, .h1 {
	font-size: 20px;
}
h1,h2,h3 {
	/* color: rgb(100,100,150); */
	color: #000;
}
/*
	For the gallery...
*/
td.thumbnail {
	padding: 2px 2px 2px 2px;
}
td.thumbnail img,td.fullsize img {
	border: 1px solid black;
}

.input {
	border: 1px solid #666;
	padding: 2px 2px 2px 2px;
}
	/**
	* news
	*/
.news {
	width: 548px;
	border-right-width: 1px;
	border-right-style: dashed; /* makes a total width of 549px */
	border-right-color: #666;

	border-bottom-width: 1px;
	border-bottom-style: dashed; /* makes a total width of 549px */
	border-bottom-color: #666;
	
	padding-bottom: 0px;
	
	margin-bottom: 10px;
	border-left: 0px;
	border-top:  0px;
}
	/**
	* guestbook
	*/

.guestentry {
	width: 549px; /* 1px border-left and 1px border-right makes total width 549px */
	margin-top: 5px;
	margin-bottom:5px;
	border: 1px dashed #666;
}


#guestform #name, #guestform #email, #guestform #url {
    width: 250px;
    height: 15px;
}
#guestform #name, #guestform #email, #guestform #url, #guestform #message {
   padding: 2px;
   height: 16px;
   border: 1px solid #666;
   /* color: rgb(0,100,100); */
}
#guestform #message {
    height: 100px;
    width: 310px;
}
#guestform label {
   float: left;
   display: block;
   
   width: 60px;
   height: 20px;
   
   padding-top: 3px;
   /*
   font-size: 11px;
   font-family: verdana;
    */
}
#guestform div {
   clear: both;
   margin: 0;
   padding: 0;
   margin-top:3px;
}
#guestform #name:focus,#guestform #email:focus,#guestform #url:focus, #guestform #message:focus {
   border: 1px solid #333;
   color: rgb(0,0,0);
}
  • Medlem
  • Karlstad
  • 2004-03-28 21:35

Hur gick det till slut?
Det är nämligen inte ovanligt (händer mig själv då o då) att man faktiskt inte tömmer webbläsarns cache, utan kikar på en gammal sida hela tiden utan att fatta varför ändringar inte slår igenom. Åsså nästa gång man startar läsaren, så funkar det eftersom IE är ställd att kolla efter nya sidor en gång per "session". :-\
Ibland kan t.o.m. Internetleverantörer cacha sidor, fast det vill dom ogärna erkänna.

  • Medlem
  • Stockholm
  • 2004-03-28 23:45

Japp!

Silly me. hade i all hast ställt in IE-mac på exakt motsatsen mot vad jag önskade.

Ändrade så den aldrig läste ifrån cache-minnet och nu fungerar det mycket bättre !

Jag har dock inte hittat lösningen till varför inte border: 1px dashed #333 inte fungerar på IE i kombination med massor av nästlade tables, när man läser ifrån fil.

Har dock lärt mig massor om css senaste månaderna och börjar få bort alla tabeller som inte ska vara tabeller och då har plötsligt problemet försvunnit av sig självt. Men så fort jag börjar koda om gamla sidor som är gjorda med massor av tabeller så fungerar inte css-koden förräns tabellerna är få till antalet.
Skumt...

  • Medlem
  • Karlstad
  • 2004-03-31 14:16
Ursprungligen av ivar:

Japp!

Silly me. hade i all hast ställt in IE-mac på exakt motsatsen mot vad jag önskade.

Ändrade så den aldrig läste ifrån cache-minnet och nu fungerar det mycket bättre !

Jag har dock inte hittat lösningen till varför inte border: 1px dashed #333 inte fungerar på IE i kombination med massor av nästlade tables, när man läser ifrån fil.

Har dock lärt mig massor om css senaste månaderna och börjar få bort alla tabeller som inte ska vara tabeller och då har plötsligt problemet försvunnit av sig självt. Men så fort jag börjar koda om gamla sidor som är gjorda med massor av tabeller så fungerar inte css-koden förräns tabellerna är få till antalet.
Skumt...

Va bra att problem nummer 1 blev löst i alla fall.

Men det andra problemet med border: Menar du IE på Mac, Classic eller OSX?
Det ska inte spela nån roll om du har nested tables eller inte (med reservation - IE på Mac kan vara sanslöst konstig ibland). Problemets lösning finns givetvis i koden nånstans. Kan du ladda upp sidan i skarpt läge och ge en URL så man kan kolla?

  • Medlem
  • Stockholm
  • 2004-04-01 11:36

sitecheck

Ursprungligen av Danne V:

Va bra att problem nummer 1 blev löst i alla fall.

Men det andra problemet med border: Menar du IE på Mac, Classic eller OSX?
Det ska inte spela nån roll om du har nested tables eller inte (med reservation - IE på Mac kan vara sanslöst konstig ibland). Problemets lösning finns givetvis i koden nånstans. Kan du ladda upp sidan i skarpt läge och ge en URL så man kan kolla?

Jag skrev om nästan all kod så jag blev av med mina nästlade tables och därimed även alla problem

Sidan ligger nu uppe och sidan som vägrade visa border: 1px dashed #666 är
denna.

Kika jättegärna på övriga delar av den siten och säg om du har förslag på förbättringar.
Strunta dock i att jag använder mappning av menybilden istället för att bryta ner menybilden till flera småbilder och slippa mappningen (som inte fungerarar i vissa äldre läsare).

  • Medlem
  • Karlstad
  • 2004-04-01 12:22
Ursprungligen av ivar:

Jag skrev om nästan all kod så jag blev av med mina nästlade tables och därimed även alla problem

Sidan ligger nu uppe och sidan som vägrade visa border: 1px dashed #666 är
denna.

Kika jättegärna på övriga delar av den siten och säg om du har förslag på förbättringar.
Strunta dock i att jag använder mappning av menybilden istället för att bryta ner menybilden till flera småbilder och slippa mappningen (som inte fungerarar i vissa äldre läsare).

Mossning,

Jag är lite förbryllad. Om du menar stylen:

#guestentries .guestentry {
margin-top: 10px;
padding: 3px;
border:1px dashed #666;
}

så hittar jag inget element med id "guestentries" eller "guestentry" på den sidan. Elller fattar jag alldeles fel?

EDIT: Nu hittade jag elementen med id "guestentry" på ditt forum. Jag sitter vid en PC och border-stylen funkar alldeles utmärkt i både IE och Firefox. Vilken browser/plattform är det den inte blir som du vill?

F.ö. haru gjort en väldigt snabbladdad, lättnavigerad och användarvänlig sajt! Vad jag kan se så har du en utmärkt bra kod. Några pyttegrejer:

Körde W3C Validator på CSS:n och fick ett fel:
Line: 0 Context : #affisch
Parse Error - ; }
Men jag vete 17 vad dom menar

Du har fontstorlekar i punkter på några ställen. Det är för tryck - inte webben.

Din epostadress ligger ute i klarskrift (i koden) och spambots kommer att suga upp den vilken sekund som helst. Ta bort den innan det händer. Kör du med DW så hämta ner en gratis extension som heter "UltimailTo 1.3" här:
http://colmgallagher.com/ultimailto.asp
Den kodar adressen och gömmer den faktiskt ganska bra.

Kör du INTE med DW, så gå till hotscripts.com eller Googla för "mail encoding script" eller liknande.

EDIT: Jag hittade en on-line encoder för epostadresser här (om du inte använder DW): http://www.colmgallagher.com/encode_all.html

Danne

EDIT igen: När jag laddade ner styles.css och sedan gick till W3C CSS Validator och laddade upp det så visades inga som helst fel. Vet inte varför den protesterade mot #affisch förut....

Senast redigerat 2004-04-01 16:57

CSS ser enkelt ut. Men attans vad man lär sig hela tiden.
Kör alla sajter jag designar helt i CSS. Blir så fiiiiin kod

  • Medlem
  • Stockholm
  • 2004-04-01 17:26

Tackar!

Ja, min epost ligger i klarskrift där och det är för att jag hoppades att folk skulle ha lätt att komma i kontakt med mig men är det som du säger så ska jag genast ta bort den... kan man göra på något annat sätt för att skriva ut sin adress så folk hittar?

Jag var kanske tydlig... sidan fungerar i samtliga webbläsare nu eftersom jag inte längre nästlar massor av tabeller i designsyfte.
Vad ska man ange font-storleken i då? Jag har förstått att man inte ska använda pixlar men när jag provade em så blev font-storleken olika på olika ställen på sidan. Kände att punkter var ett steg i rätt riktning i jämförelse med pixlar.

blev plötsligt stressad, får skriva mer sen! måste springa nu

  • Medlem
  • Karlstad
  • 2004-04-01 18:48
Ursprungligen av ivar:

Tackar!

Ja, min epost ligger i klarskrift där och det är för att jag hoppades att folk skulle ha lätt att komma i kontakt med mig men är det som du säger så ska jag genast ta bort den... kan man göra på något annat sätt för att skriva ut sin adress så folk hittar?

Jag var kanske tydlig... sidan fungerar i samtliga webbläsare nu eftersom jag inte längre nästlar massor av tabeller i designsyfte.
Vad ska man ange font-storleken i då? Jag har förstått att man inte ska använda pixlar men när jag provade em så blev font-storleken olika på olika ställen på sidan. Kände att punkter var ett steg i rätt riktning i jämförelse med pixlar.

blev plötsligt stressad, får skriva mer sen! måste springa nu

Kolla encoding-tipsen jag gav dig. Dom ger en fullständigt bisarr kod när man tittar på den med ögat. Men när en webbläsare ser den så blir den rätt: Folk kommer alltså att se rätt adress och en "mailto"-länk kommer att öppna ett nytt epostmeddelande med rätta adress i folks mail-klient - men i princip ingen spambot kommer att fatta att det är en epostadress.

Nästade tabeller: Nu har du ju skitfin kod och bara divisions, så allt är ju finemang. Men CSS ska funka i nästade tabeller åxå, så det va nog galet du hade gjort då.

Fontstorlekar: Alldeles egentligen och enligt alla usabilty-gurus, så ska man allra helst ange fontstorlekar i direkt relation till användarens inställningar, dvs i ems, procent eller "small", "medium" etc. Storlek i pixels är dock det vanligaste, men folk med IE på PC kan inte ändra om dom vill utan att börja fibbla med webbläsarens preferences, och dom står ju för största delen av besökarna vanligen, så man borde faktiskt tänka på det.

Men storlek i punkter är endast och allena för print.

Skälet till att fontstorleken blev olika på olika ställen när du använde ems berodde säkert på att styles "ärvs". Dvs om du t.ex. har 1.3 ems i body-taggen, och sedan sätter 0.8 i t.ex. en tabell, så blir det sista 0.8 av 1.3. Eller om man tar det i procent (lite lättare att fatta):

Om du sätter en fontstorlek av 120% i body-taggen och sedan en annan i en tabell på 80%, så blir det 80% av fontstorleken i bodytaggen (dvs 120%) eftersom tabellen finns inuti body-taggen. Måttet för fonten i tabellen "ärver" måttet från body-taggen.

(Jag begriper nog inte själv vad jag skrev nyss. Hoppas du fattar bättre).

Danne

  • Medlem
  • Stockholm
  • 2004-04-01 22:44

Hej igen !
om man skriver 100% så är det ju enkelt förstått men däremot om man skriver 1em så vet jag inte exakt vad det innebär. Motsvarar det 100% ?

Förstörs inte lite av ens makt genom att visa sidan i besökarens önskade fontstorlek?? Jag har ju satt den till en viss storlek och sen vill jag att den ska förbli den storleken

Tack för tipset om kodning av e-postadresser... orkade inte ge mig in på något tyngre och jag är övertygad om att spambots kommer lära sig tolka hex-koden inom kort.

Då arbetet i stort sett är avslutat så fick en enkel snabb lösning bli

$email = str_replace("@","@,$email);

vilket gör att den inte hittar @-tecknet

EDIT: hahaha, det andra @-tecknet är "& # 6 4 ;" fast utan mellanslag

EDIT2: För att försvåra lite till så kom jag på att man väldigt enkelt även kan byta ut texten "mailto:" till hex-värden så nu gjorde jag även det. Kika på källkoden på www.kilotin.se/index.php?goto=guestbook/view så ska ni få se hur knasiga mail-länkarna ser ut

Tack ännu en gång för det bra tipset!

  • Medlem
  • Karlstad
  • 2004-04-02 07:42
Ursprungligen av ivar:

Hej igen !
om man skriver 100% så är det ju enkelt förstått men däremot om man skriver 1em så vet jag inte exakt vad det innebär. Motsvarar det 100% ?

Förstörs inte lite av ens makt genom att visa sidan i besökarens önskade fontstorlek?? Jag har ju satt den till en viss storlek och sen vill jag att den ska förbli den storleken

Tack för tipset om kodning av e-postadresser... orkade inte ge mig in på något tyngre och jag är övertygad om att spambots kommer lära sig tolka hex-koden inom kort.

Tack ännu en gång för det bra tipset!

Hmmm..jag haver aldrig använt "em" eller fördjupat mig i ämnet, men jag tror att det motsvarar "100%", dvs användarens default-storlek, ja. Googla. Det finns säkert gott om tutorials, eller sök på W3Cs sajt.

Jo, formgivarens "makt förstörs" när man låter hans valda fontstorlek bli den som syns. Men det är liksom poängen med Internet, och något som folk som sysslat med tryck tidigare har väldigt svårt att fatta och acceptera. Till viss del SKA utseendet på en webbsida kunna styras av användaren.

(Min personliga åsikt är att webben och webdesign utvecklas av tekniker som inte har en susning om hur viktig den visuella formgivningen faktiskt är. Dom ropar "content is king", dvs det är bara själva innehållet som är viktigt, inte hur detta ser ut, vilket alltså jag anser är rent struntprat av folk som inte vet bättre. Men eftersom det är dom som bestämmer villkoren för hur webben ser ut, så har du idag inte ens möjligheten att välja typsnitt och kan inte ens göra en rund ring i html - bara raka linjer och 90 graders vinklar, eftersom dom tycker att det räcker. Tråkigt.)

Om länken till encoding scriptet: Jag tror inte att du brydde dig om att kolla, eftersom det inte alls är "tunga grejer". Du hamnar på en sida med fyra rutor. Fyll i vad du vill användaren ska se, vad epostmeddelandet ska ha för rubrik, mottagaranes (din) epostadress och eventuellt om du vill ha med ett meddelande. Trck på en knapp, och vips har du koden som du kopierar och klistrar in på din sajt. Simsalabim, gjort på en minut och min mormor skulle klara det utan löständerna isatta.

Danne

  • Medlem
  • Stockholm
  • 2004-04-02 11:50
Ursprungligen av Danne V:

Om länken till encoding scriptet: Jag tror inte att du brydde dig om att kolla, eftersom det inte alls är "tunga grejer". Du hamnar på en sida med fyra rutor. Fyll i vad du vill användaren ska se, vad epostmeddelandet ska ha för rubrik, mottagaranes (din) epostadress och eventuellt om du vill ha med ett meddelande. Trck på en knapp, och vips har du koden som du kopierar och klistrar in på din sajt. Simsalabim, gjort på en minut och min mormor skulle klara det utan löständerna isatta.

Danne

Jodå, jag kollade absolut in sidan men jag behövde ju en dynamisk lösning för forum-sidan där epostadresserna inte är hårdkodade.
På forumsidan bytte jag ut "mailto:" till hex-kod samt @-tecknet till hex-kod. Dock gjorde jag bara de åtgärderna på "Om Kilotin"-sidan också.

Känner mig helt övertygad om att spam-bots kan förbi se hex-koden och faktiskt få fram e-postadresserna ändå. Om inte idag så inom kort. Men det här är åtminstone ett litet enkelt steg på vägen för att krångla till det för dem. (och dessvärre göra sidan mer tungladdad kod-mässigt för oss)

  • Medlem
  • Karlstad
  • 2004-04-02 12:13
Ursprungligen av ivar:

Jodå, jag kollade absolut in sidan men jag behövde ju en dynamisk lösning för forum-sidan där epostadresserna inte är hårdkodade.
På forumsidan bytte jag ut "mailto:" till hex-kod samt @-tecknet till hex-kod. Dock gjorde jag bara de åtgärderna på "Om Kilotin"-sidan också.

Känner mig helt övertygad om att spam-bots kan förbi se hex-koden och faktiskt få fram e-postadresserna ändå. Om inte idag så inom kort. Men det här är åtminstone ett litet enkelt steg på vägen för att krångla till det för dem. (och dessvärre göra sidan mer tungladdad kod-mässigt för oss)

Ah! Jag tänkte inte på adresserna på forum-sidan. Mitt misstag. Sorry.

Ja och nej, spambots skulle relativt enkelt kunns se förbi kodade epostadresser, men gör det faktiskt inte. Jag har haft flera adresser ute på just detta sättet under nästan två år, och får aldrig mer än högst ett spam i veckan till någon av dom. Jag är faktiskt (glatt) förbluffad själv.

Skälet är sannolikt ganska enkelt: Spammare får in en sån oerhörd mängd med epostadresser ändå genom att köra med robots som inte begriper kodade adresser så att dom troligen struntar i de få som roboten inte ser.

Förresten, den där encodern som jag gav länk till gör koden i en konstig kombination av BÅDE hex och decimaler - extra jävligt.

här är en annan "email encoder": http://www.hiveware.com/enkoder_form.php

  • Medlem
  • Karlstad
  • 2004-04-03 12:05

Apropos fontstorlekar, och om du är intresserad av hur man ska ange dom:
Hittade nyss en bra tråd av CSS-gurun Eric Meyer i en diskussion. Han publicerar bl.a. några länkar som det är värt att följa o läsa:
http://archivist.incutio.com/viewlist/css-discuss/33192

1
Bevaka tråden