Kategoriarkiv: HTML & CSS

Byta utseende på bloggen

Nu har jag lagt in möjlighet att själv byta utseende på Blanksteg.com efter eget tycke och smak, så länge som ens tycke och smak består av färgerna rosa, grönt och blått förstås. Byter färg gör man längst upp i vänstra hörnet, på de färgade små flikarna.

Hur gick jag då tillväga? Det hela är väldigt enkelt om man har lite htmlkunskaper. På http://www.kelvinluck.com/2006/05/switch-stylesheets-with-jquery/ finns det jqueryscript som behövs för att få funktionaliteten, sedan är det bara att utforma knappar och skriva fler cssfiler. Har man då en blogg där man kommer åt ftp, eller åtminstone kan uppdatera och lägga upp nya filer så är det inga större problem att göra något liknande.

Finns fortfarande mycket som måste göras för att få till den här bloggen som jag vill ha den, men jag är på god väg.

WordPress 3 innebär nytt bloggutseende

Jag har varit riktigt tråkig och inte bloggat på en månad nu (igen). Anledningen är att jag inväntar WordPress 3 som kommer snart. Då ska jag byta bloggdesign till en ny som jag håller på med, med lite bättre kod, bättre kopplingar i WordPress och till Twitter och Last.FM. Mest saker som jag själv kommer märka av.

Så på semestern som närmar sig med stormsteg ska jag slå om till den nya designen. Se fram emot det. 😉

Just nu ser jag fram emot vad galenpannan Kringlan kan hitta på i sin nya sitcom Kringlans semester.

Centrera text på höjden i div oavsett textstorlek

Det finns lite olika varianter för att centrera en divs innehåll på höjden. Ett exempel är att sätta diven till display:table-cell, för att på så sätt kunna använda sig av vertical-align:middle. Men detta fungerar bättre i Firefox än i IE. Har man däremot bara en rad med text som man inte vet storleken på så är lösningen riktigt enkel. Sätt bara line-height:”Samma värde som diven är hög”.

T.ex. om du har en div som är 200px bred och 75px hög och vill centrera en rad med text oavsett storlek kan man enkelt skriva:
width:200px;
height:75px;
text-align:center;
line-height:75px;

Exempel:

Exempeltext

Att skicka mail i HTML från en sida

Stötte på ett problem på jobbet igår när jag skulle låta kunden kunna skicka en sida på sin webbplats som ett mail i HTML.

Det jag inte visste var att webmailklienter som hotmail, yahoo och gmail inte har stöd för stilmallar. För att de inte ska riskera att sidan buggar ur när ett mail läses in så läses inte utomstående stilmallar in. Det man får göra för att vara på den säkraste sidan är att koda den sidan som ska skickas med inline css. M.a.o. lägga till style på alla element.

Desktopmailklienter som outlook m.fl. har lite bättre stöd dock.

Hela listan på de vanligaste klienterna finns här: http://www.campaignmonitor.com/css/

Blanksteg i html
30 maj, 2009

Blanksteg i html

Det kan säkert trilla in en och annan på den här sidan som vill veta hur man skriver ett mellanslag i html, eftersom sidan heter som den gör. Därför tänkte jag att det är ju självklart bättre att förekomma än förekommas. Att koda ett mellanslag kan vara bra om man t.ex. vill ha fler än ett mellanslag i rad. Tänkte även tipsa om andra tecken som kan vara ett tips att lära sig utantill.

  • Mellanslag – ” ” –  
  • Ochtecken – ”&” – &
  • Eurotecken – ”€” – €
  • Mindre-än-tecken – ”<” – &lt;
  • Mer-än-tecken – ”>” – &gt;
  • Citationsmarkering – ””” – &quot;
  • Dubbelpil höger – ”»” – &raquo;
  • Copyright – ”©” – &copy;
  • å, Å – &aring; &Aring;
  • ä, Ä – &auml; &Auml;
  • ö, Ö – &ouml; &Ouml;

En mer utförlig lista finns här