---
title: "Flytta upp en bild 2px"
type: "forum-thread"
url: "https://www.webforum.nu/amne/html-css/192260-flytta-upp-en-bild-2px"
topic: "HTML & CSS"
topic_url: "https://www.webforum.nu/amne/html-css"
author: "Matsakii"
published: "2014-04-19T00:13:26.000Z"
updated: "2014-04-19T10:39:41.000Z"
replies: 5
views: 1067
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/html-css/192260-flytta-upp-en-bild-2px"
---

# Flytta upp en bild 2px

## #1 — Matsakii, 2014-04-19T00:13Z

Jag har en css kod för en kassa där en varukorg ikon är framför texten (Din varukorg är tom) Se bifogad skärmdup.

Jag behöver flytta upp ikonen lite (2px) för att få den mer centrerad med texten efter.

Koden ser ut så här:

```
.cart-1 {
	font-size: 12px;
	/*font-size: 20px;*/
	color: #FFFFFF;
	background-image: url(../images/cart.png);
	background-repeat: no-repeat;
	background-position: left center;
	line-height: 32px;
	padding-bottom: 8px;
	padding-left: 30px;
	text-align: right;
```

Och det är på raden 

> "background-position: left center;"

 jag har försökt lägga så ikonen flyttas upp. Med där står bara "left center;" Lägger jag till "top" då åker den upp i taket.

Hoppas det finns någon tråkig nörd som jag och bara VÄNTAR på att få svara på frågor en kväll/natt som denna  :e

Glad Påsk på er annars, alla gubbar och snygga tjejer som året runt försöker hjälpa oss novisa.

Bilagor:

- [skärmdump.png](https://www.webforum.nu/a/23655.png)

Permalänk: https://www.webforum.nu/p/192260

## #2 — Sharkie, 2014-04-19T09:09Z

I väntan på rätt svar kan du ju prova margin-top / margin-bottom och se vad det gör. Du kan använda negativt avstånd också. Padding-top / padding-top kanske också kan göra susen.

Jag kan inte CSS flytande, så i såna här lägen provar jag mig fram, du kan ju prova det också :)

... och för att ge dig min tankegång i ett sånt här ärende, så undrar jag inte om det är läge att lägga ikonen enskild istället?
Eller kanske "dinkundvagntext**:before** { stoppa in kundvagnsikonen }"

CSS-kungarna här vill nog ha koden där korgen och texten ligger, de divar m.m. du har där.

Hoppas jag inte förvirrar dig för mycket :D

Permalänk: https://www.webforum.nu/p/2315990

## #3 — Matsakii, 2014-04-19T09:29Z

Det borde gå och sätta ett värde. För om jag lägger till "top" i raden "background-position: left center;" så åker ikonen upp, men inte texten. Fats jag hittar inte hur jag sätter ett värde på "top"

Permalänk: https://www.webforum.nu/p/2315991

## #4 — Danne V, 2014-04-19T09:51Z

Ändra vertikala positionen i stilmallen:

background-position: left -5px; 

(-5px avser avstånd från överkant i föräldraelementet. Flyttar alltså upp bilden. Du kan även flytta neråt med t.ex. 5px, eller använd %, mm eller andra enheter om du vill.)

<http://reference.sitepoint.com/css/background-position>
<http://www.techonthenet.com/css/properties/background_position.php>

Permalänk: https://www.webforum.nu/p/2315992

## #5 — Matsakii, 2014-04-19T09:58Z

Det är horisontalt jag vill flytta upp den 2px. jag har test lägga till "top 10px" men det fungerar inte.

Permalänk: https://www.webforum.nu/p/2315993

## #6 — Danne V, 2014-04-19T10:39Z

> **[Matsakii skrev:](https://www.webforum.nu/p/1570960)**
>
> Det är horisontalt jag vill flytta upp den 2px. jag har test lägga till "top 10px" men det fungerar inte.

Höger/vänster är HORISONTALT och det första värdet .Upp/ner är VERTIKALT och det andra värdet. Beräknas från vänster och topp av det inneslutande elementet.

Det du gjort är att tvinga ner bilden ytterligare 10px.

Ska du flytta upp ska du alltså ha ett NEGATIVT värde (-2px eller vad du vill ha) bör det alltså se ut så här:

background-position: left -2px;

Vid tveksamheter, kolla gärna sidorna jag länkade till. Där står allt du behöver veta.

Permalänk: https://www.webforum.nu/p/2315994

---

Tråden på webben: https://www.webforum.nu/amne/html-css/192260-flytta-upp-en-bild-2px