Avatar billede marrix Juniormester
01. juli 2004 - 15:43 Der er 8 kommentarer og
1 løsning

Css i e-mail/nyhedsbrev

Hej eksperter...

Jeg er ved at udvikle et nyhedsbrev. Jeg bygger det op, som en ganske almindelig html-side med interne styles/CSS. Men når jeg sender siden, og tjekker den i mit mailprogram, bliver de styles, jeg definerer med en ID-selector (er det ikke det det hedder?!), smadret af at mailprogrammet tilføjer sine egne styles. Det er vist nemmest at vise med et eksempel:

Mine styles:

#topbar
{et-eller-andet}

.overskrift
{et-eller-andet-andet}

a
{noget helt tredie}

...og dette bliver så lavet om til følgende i mailprogrammet:

#message #topbar
{et-eller-andet}

#message .overskrift
{et-eller-andet-andet}

#message a
{noget helt tredie}

Altså, mailprogrammet laver sit eget style "<div id="message></div>", hvori hele mit html-dokument bliver indlejret. Og det smadrer altså mine egne ID'er, hvorimod CLASS og styles på html-tags (vist nok) fungerer ok.

Sker noget tilsvarende i alle mailprogrammer?
Hvad kan jeg gøre for at få mit nyhedsbrev/email til at virke med mine styles?

...jeg kunne selvfølgelig lave det hele om, og bygge det op i en tabel i stedet, meeeeen..... det burde da kunne fungere med styles...eller hva' siger eksperterne?!?

HJÆLP - haster...

Allervenligst, marianne
Avatar billede kreativmedie Nybegynder
01. juli 2004 - 16:05 #1
Jeg har selv lavet et nyhedsbrev med interne stylesheets. Det virker fint, i hvert fald i de mailprogrammer jeg har testet det i. Jeg brugte CLASS, ikke ID, og definerede desuden table, td, osv., altså f.eks. table.topbar, td.overskrift og så fremdeles.

Hvilket mailprogram er det der ødelægger det?
Har du helt udeladt tabeller? Altså sat det alt indhold op i div-tags?
Avatar billede marrix Juniormester
01. juli 2004 - 20:53 #2
Undskyld jeg først vender tilbage nu. Har skulle nå en masse på hjemmefronten efter fyraften.

...nej, jeg har en stump tabel med også. Men pga forskellige grafiske elementers placeringer (menulinjer, logo-bjælker mv.) i forhold til hinanden, har jeg fundet det absolut nemmest, at placere disse vha. DIV-tags. Jeg har tidligere brugt tabeller en hel del, og forsøgte også til denne, men det var nærmest umuligt, at få det præcist, som jeg gerne vil have det. Derfor valgte jeg DIV-tags. Kan jeg bruge CLASS til at positionere elementer? Andre gode forslag?

Venligst, marianne
Avatar billede kreativmedie Nybegynder
02. juli 2004 - 16:07 #3
Hej igen,

Har personligt ikke den store erfaring med ID/DIV, da idéen med CSS aldrig har været at man skal sætte hele eller store dele af layouts op på denne måde. Måske er det også derfor du oplever disse problemer.
Desuden renderer et program som Outlook ikke altid HTML og CSS lige så omfattende som en rigtig browser.

Jeg er rimelig overbevist om at dit problem vil blive løst hvis du benytter CLASS i stedet for DIV, da det ses i dit eksempel at emailprogrammet overruler din kode med sine egne #message.
Men jeg fornemmer også at dette vil være et ret omfattende arbejde og sikkert ikke er noget du er interesseret i?

Kan umiddelbart ikke komme på andre løsningsforslag, da emailprogrammer oftest er rimelig kræsne og har deres egne regler for hvordan grundlayoutet i en HTML-mail skal se ud.
Sørg i øvrigt for at du IKKE vedhæfter eventuelle billedfiler, men derimod smider dem op på en server så de hentes derfra når brugeren åbner mailen.
Avatar billede pixeldude Nybegynder
02. juli 2004 - 22:56 #4
Undskyld jeg bryder ind.

CSS er lige netop til at lave designs med.  F.eks. hvis man bruger XHTML så er man jo nødsaget til at bruge CSS

Hvis man har lavet sin MarkUp ordentlig kan man skifte sit deisgn 100% ved at skifte sin CSS.

Her er lidt læsestof:
http://www.zeldman.com
http://www.csszengarden.com
http://www.meyerweb.com
http://www.quirksmode.org
Avatar billede roenving Novice
02. juli 2004 - 23:35 #5
Men, pixeldude, du har vist overset hvad css betyder ...

Cascading Style Sheets betyder, at styles kan cascades, altså at grundideen er, at man opbygger sine layouts i træ-form (som f.eks. et mappetræ på en harddisk !-), så man kan sætte nogle styles, som så arves ind i underliggende elementer, hvor de måske modificeres og så arves yderligere ud i grenene !o]

(-- og det er csszengarden et eklatant eksempel på, at man netop ikke gør, for selv om det er flot, så holder det ikke en meter, hvis man prøver at finde bare et spor af det allermest grundlæggende i cascading !-)

Ikke at det er ukorrekt, men det er i hvert fald kun (c)SS ...
Avatar billede pixeldude Nybegynder
03. juli 2004 - 00:00 #6
Jeg ved godt hvad CSS betyder.  Det var bare for at gøre opmærksom på at CSS i højgrad er til at designe med.

Man kunne jo faktisk lave et helt site med list elementet ...
Avatar billede marrix Juniormester
03. juli 2004 - 15:14 #7
Hej...

Jeg har nu lavet alle mine DIV om til CLASS. Men jeg har stadig lidt problemer med at få baggrundsbilleder med - men ellers virker det ok. I øvrigt har jeg erfaret (kommer sikkert ikke som en overraskelse for d'herrer eksperter... ;)  ), at de forskellige mailbokse tolker mailsene helt forskelligt. Nogle kan håndtere DIV - de fleste andre kan ikke, nogle af dem tager billederne med - andre vedhæfter dem, nogle af dem lader javascript komme med - de fleste andre fjerner det, osv. Sikke't mareridt at kode op mod.

Nå men jeg tror jeg holder mig til table og CLASS - som >>kreativmedie anbefalede indledningsvis. Det ser da ud til at fungere nogenlunde i de fleste mailbokse...

>>kreativmedie, vil De venligst erlægge et styks svar?

Venligst, marianne
Avatar billede kreativmedie Nybegynder
03. juli 2004 - 15:35 #8
Mange tak den dame! :)

Ja, som jeg skrev tidligere, så er nogle mailbokse ekstremt kræsne og har deres egne regler, men det korte af det lange er i hvert fald at du er bedre tjent med CLASS og tables. Så har du i hvert fald gjort dit til at det ser ens ud i så mange mailbokse som muligt.
Ydermere kunne man helt skippe CSS'en og lave nyhedsbrevet kun i HTML, men uha, hvilket helvede dette ville være :)

Og pixeldude: Så sandt at man kan lave komplette designs stort set kun med CSS, men det er altså ikke det det er udviklet til. Man kan også blende jordbær med en skruetrækker, men det er ikke dens primære funktion.
Hvis man ikke passer på kunne jeg snildt forestille mig at du kan løbe ind i problemer med hvordan sitet vises i browsere som f.eks. Opera og Mozilla, og især på Mac.
Avatar billede marrix Juniormester
03. juli 2004 - 21:55 #9
....selv tak, den herre ;)

Og tak for hjælpen til alle.

Venligst, marianne
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester