Komma åt textnod med CSS

[Gerhard]

Håller på och mixtrar lite med min blogg, där jag försöker få till det så att första bokstaven i varje inlägg blir väldigt stor. Detta fixar jag med first-letter i CSS. Dock är det så att de inlägg som innehåller en bild inte får den här stora bokstaven, och jag vet nog varför:

 

Ett vanligt inlägg ser ut som såhär, och funkar helt felfritt:

 

<p>Detta är en text...</p>

 

De med bild ser dock lite annorlunda ut, då a-taggen (bilderna är länkar) ligger före brödtexten eftersom de ska vara float: right:

 

<p><a href="http..."><img src="bild.jpg" /></a>Detta är en text...</p>

 

När jag väljer att första bokstaven ska vara annorlunda så verkar webläsaren även räkna med de första taggarna. Man hade ju kunnat tro att dessa skulle ignoreras, men tyvärr är det inte så.

Man hade ju kunnat skriva om koden, men då det ligger hårdkodat i databasen så känns det inte som ett bra alternativ, då jag först måste uppdatera alla rader med en sql-sats, sedan skriva om php'n (vilket jag inte behärskar) för att även nya inlägg ska se likadana ut.

 

Några förslag? Enklast vore ju helt enkelt om jag kunde komma åt texten efter a-taggen på ett smidigt sätt.

[tema]

Det enklaste vore förstås:

<div><a href="http..."><img src="bild.jpg" /></a><p>Detta är en text...</p></div>

eller lägga texten i en <span> som kan användas som mål.

Men eftersom det inte verkar så genomförbart:

 

Det enda jag kan tänka mig är att använda a:after med :first-letter men då måste du även infoga bokstaven.

ccs2 kan nog helt enkelt inte träffa så exakt…

 

En lösning med javaskript vore förstås möjligt.

[Gerhard]

Jo, jag har också testat :after, men det verkar ju som sagt inte vara så dynamiskt. Får känslan i alla fall att det jag är ute efter inte är möjligt utan att använda sig av annan kod, t.ex. just javascript. Kanske borde försöka något sådant. Kan dock föreställa mig att sidan blir lite långsammare vid inladdningen.

[tema]

Jo, jag har också testat :after, men det verkar ju som sagt inte vara så dynamiskt. Får känslan i alla fall att det jag är ute efter inte är möjligt utan att använda sig av annan kod, t.ex. just javascript. Kanske borde försöka något sådant. Kan dock föreställa mig att sidan blir lite långsammare vid inladdningen.

Den lilla mängd kod man behöver för detta innebär inte särskilt mycket extra tyngd. Däremot innebär det förstås en liten extra ansträngning för klienten och det fungerar inte om javascript är avstängt.

 

Det bästa är naturligtivs att bekämpa problemet vid källan, alltså se till att servern levererar rätt kod. (Spara html direkt i databasen är inte en särskild bra lösning i sig.)

[Gerhard]

(Spara html direkt i databasen är inte en särskild bra lösning i sig.)

 

Det är wordpress som väljer att spara så, inte jag.