CSS: placera bakgrundsbild till höger med padding 10px

6 svar · 1 883 visningar · startad av silfver 18 maj 2011

silfverMedlem sedan apr. 200312 679 inlägg

Frågan18 maj 2011 08:21#1

Den här koden fungera i IE9:

a {background: url(../img/up.png) no-repeat center right 10px;}

Men i Firefox så visas inte bakgrundsbilden.

Jag har ingen möjlighet att ändra elementen utan kan bara ändra css:en. Bakgrundsbilden går just nu ända in i högerkanten vilket gör att det ser fel ut. Jag vill att den skjuts in till vänster 10 pixlar. Men kan inte sätta fasta mått eftersom den måste vara dynamisk.

Förstår ni mitt problem? Går det lösa?

Nate.AMedlem sedan mars 2006296 inlägg

18 maj 2011 09:20#2

center måste ju vara överflödig, prova att bara ta bort den. Ser ut som att det borde fungera annars.

silfverMedlem sedan apr. 200312 679 inlägg

18 maj 2011 09:36#3

Nate.A skrev:

center måste ju vara överflödig, prova att bara ta bort den. Ser ut som att det borde fungera annars.

Ja, det borde fungera. :D Men icke. Se bifogad fil.

a {background: url(../img/up.png) no-repeat right 10px;}

Nate.AMedlem sedan mars 2006296 inlägg

18 maj 2011 09:49#4

Nu förstår jag hur du menar! :) Då måste jag meddela att det inte går, du kan använda procent för att placera den ungefär på rätt ställe. ex:

a {background: url(../img/up.png) no-repeat center 80%;}

eller så kanske du kan använda margin-right:

a {background: url(../img/up.png) no-repeat center right; margin-right:10px;}

silfverMedlem sedan apr. 200312 679 inlägg

18 maj 2011 09:57#5

Jag har prövat att sätta procent men det blir fult eftersom pilen hoppar beroende på kolumnbredden (det finns flera). Sätter jag margin-right på 10 pixlar så blir ju hover-bakgrunden fel med 10 pixlar. :(

Ska jag behöva erkänna mig besegrad denna gång? ;)

Danne VMedlem sedan aug. 20068 090 inlägg

18 maj 2011 10:39#6

Testa att markera med "important":

a {background: url(../img/up.png) no-repeat right 10px!important;}

Funkar inte det, och om du inte orkar/vill knöla med css, hämta bilden till Photoshop, lägg till 10px transparens till höger på den och spara om den som gif eller png.

silfverMedlem sedan apr. 200312 679 inlägg

18 maj 2011 10:51#7

Danne V skrev:

Funkar inte det, och om du inte orkar/vill knöla med css, hämta bilden till Photoshop, lägg till 10px transparens till höger på den och spara om den som gif eller png.

Självklart. Tack. ;)

btw. !Important fungerade inte heller.