Ändra textplacering i rubriken

av The Blog Guru den 25 december, 2009

När det gäller din bloggdesign så finns det så mycket du kan ändra på. Och jag ska göra mitt bästa för att hjälpa till. Jag tror att det bästa sättet att göra det på är att skriva guider.

I den här guiden tänker jag berätta hur du ändrar textplaceringen i dina rubriker.
Som du ser på bilden nedanför så ligger rubriken precis intill kanten. Det ska vi ändra på!

H3_F

För att ändra utseendet på din blogg går du in i stilmallen. Vill du veta mer om grunderna i en blogg.se design så kan du börja med att läsa här.

När du väl är i stilmallen tryck CTRL + F, eller om du har en MAC cmd + F. Då får du fram din webbläsares sökfunktion. Där ska du skriva in Entry headers, och sen ska du trycka på enter.

Då kommer du hitta texten du ser på bilden nedan. Texten som är inringad är den som ska bytas ut.

H3_CSS1

På bilden nedan ser du att jag har skrivit in 20 px istället för 0px.

H3

Detta leder till att utrymmet mellan ”rubrikkanten” och texten ökar med 20 pixlar. Du kan se på bilden nedan vad det gav för resultat.

H3_CSS_2

Så nu har vi enkelt ändrat placeringen på rubriken. Men 20px är inte rätt inställningar för alla. Så om du vill att mellanrummet(mellan kanten och rubriken) ska minska en aning, då ersätter du 20px med ett lägre tal helt enkelt.

Om du vill ändra mellanrummet ovanför eller under rubriken också så ska du ändra de andra talen på samma rad(i stilmallen).
Något som är bra att veta när man ska ändra padding är vad de olika talen representerar.
Här nedan har jag märkt varje tal med en färg, och efter det förklarar jag vad som förändras om du ändrar talet.

Padding: 10px 10px 10px 10px

10px – Ovanför
Här ändrar du mellanrummet ovanför rubriken

10px – Under
Här ändrar du mellanrummet under rubriken

10px – Höger
Här ändrar du mellanrummet till höger om rubriken. Men eftersom rubriken är vänsterjusterad så kommer det här snarare att styra när rubriken fortsätter på en ny rad.

10px – Vänster
Här ändrar du mellanrummet till vänster om rubriken. Det är den ändringen jag har visat högre upp i det här inlägget.

Om du har några frågor eller funderingar så svarar jag gärna på dem i kommentarsfältet!

  • WordPressGuru
    Hej igen... Förlåt som det känns som att jag tjatar lite... Men jag upptäckte ett fel i din text.
    Padding, om den deklareras i samma sats deklareras på följande sätt:
    padding: upp höger ned vänster
  • WordPressGuru
    Hej. Tänkte bara upplysa dig om att de tre kommentarerna som är innan mig här är spam kommentarer. Kolla hur deras länkar går till roulette sidor...

    Det är alltid roligt med kommentarer... men skräpkommentarer är aldrig kul...

    Lycka till med sidan.
  • Oh, OK, jag tror att jag fattar – men fungerar det här verkligen?
  • The Blog Guru
    Ja det fungerar. Men om det är något du undrar över så är det bara att säga till så försöker jag hjälpa till!
  • Tusan också, det låter så enkelt om du tänker efter.
  • Jag känner mig ändå lite dum att jag inte tänkt på det här själv tidigare.
blog comments powered by Disqus

Äldre inlägg:

Nyare inlägg: