Stack Overflow
Stack Overflow

Questions tagged [background-image]

The background-image CSS property sets one or more background images for an element.

Description

The CSS background-image property sets one or several background images for an element. The images are drawn on successive stacking context layers, with the first specified being drawn as if it is the closest to the user. The borders of the element are then drawn on top of them, and the background-color is drawn beneath them.

Value:          <url> | none | inherit
Initial:        none
Applies to:     all elements
Inherited:      no
Percentages:    N/A
Media:          visual
Computed value: absolute URI or none

Examples

#example { 
    background-image: url("images/darkpattern.png"); 
}

References

  1. background-image - W3C Specification
  2. background-image - MDN Link
6010 questions
12
votes
5 answers

Google chrome a:visited background image not working

(before I start I should say yes, I have done all the stupidity checks, yes the link is in my history and has been visited etc) I'm using Chrome version 6.0.472.63, although it's important that this works on all browsers. It works on Firefox, IE and…
John Mellor
  • 2,351
  • 8
  • 45
  • 79
12
votes
7 answers

Ionic background-image not showing on device

I've set a custom class .auth-pane on a page in my Ionic app in order to style it with a custom background. The CSS for the background is... .auth-pane { background-image: url("../img/auth-background.jpeg"); background-position: center; …
cflann
  • 309
  • 1
  • 3
  • 7
12
votes
4 answers

Fragment has default white background on replace() instead of transparent one

I am facing a strange problem while using fragments and just cant figure it out. When I am replacing fragments inside my MainActivity container, some will keep the desired transparent background, and some will show a default-like white one. I…
W3hri
  • 1,563
  • 2
  • 18
  • 31
12
votes
5 answers

CSS background-position animate right to left

I'm trying to animate a background-image, so that the image appears from right to left. I have used an image which has a greater width than the div-container, where the background is located. On start, the backgrond is the following background:…
Maexwell
  • 161
  • 1
  • 1
  • 5
12
votes
2 answers

Rails 4 - Background Image Appears in Localhost but not in production

I recently rewrote one of my Rails 3.2.13 applications to use Rails 4. I used twitter-bootstrap-rails 2.1.2 in my Rails 3 application. When I rewrote the Rails 4 version it started using version 2.2.8. I'm using Phusion Passenger 4.0.20 on my…
Pamela Cook - LightBe Corp
  • 3,912
  • 5
  • 50
  • 86
12
votes
2 answers

Rotating a background image with CSS3

I have a background image that has an arrow that points to the right. When a user clicks on the button, the selected state changes the arrow to point down (using a different background position in my image sprite). Is there anyway to animate this…
Cofey
  • 11,144
  • 16
  • 52
  • 74
12
votes
7 answers

Auto-resizing skewed background in CSS (+ images?)

I'm going to convert this PSD image to CSS. I've multiple h2s in multiple pages, so the inner text lenght and background-color may vary. Therefore the background should automatically adapt to "any" length. So far, the markup is something like:
Giona
  • 20,734
  • 4
  • 56
  • 68
12
votes
1 answer

Fallback for css3 multiple background-images?

I've got 2 images as background of my body: background: url(../img/upper_bg.png) 0 495px repeat-x, url(../img/bg.png) repeat; I found out that in order to show upper_bg.png above bg.png image I needed to place it first in the list. However for…
Ilja
  • 44,142
  • 92
  • 275
  • 498
12
votes
2 answers

How to get background image/ image to stretch to fill container via CSS?

I have a scale vector image and I want it to fill a container. There's a couple of these sort of questions on SO, although they are a tad old. E.g. Stretch and scale CSS background However, when I've attempted to implement such solutions the results…
user137263
  • 747
  • 5
  • 11
  • 25
12
votes
2 answers

Including background image with CID

I need to embedd an image into an HTML mail. The image itself is already working and embedded into the mail as it is supposed to but there is one problem: The pic is shown via : but not with:
Chris
  • 1,226
  • 1
  • 12
  • 26
11
votes
6 answers

remove background-image from style

How can i remove background-image from element style. I don't want to set it to none or 0. I want to remove it completely. it's conflicting with moz-linear-gradient which is defined in another class.
Pinkie
  • 10,126
  • 22
  • 78
  • 124
11
votes
3 answers

Display an image in span without converting it to a block level element

I am a little confused over here. I have a txtbox and to the right of the txtbox, i want to insert a help icon. i have inserted that into a span. the problem is that i dont want to make this span a block because it goes down then. is there any other…
themajiks
  • 420
  • 1
  • 8
  • 23
11
votes
4 answers

When zooming on Chrome, image sprite becomes misaligned

On Chrome when you zoom, the icons with an image sprite become misaligned. The position seems to drop slightly as you go farther down the background image. This only happens in Chrome. Here's the CSS. .feature-icon { height: 22px; width:…
Nathaniel S
  • 325
  • 2
  • 11
11
votes
3 answers

How to keep background image on bottom left even scrolling

I was wondering if there is a way to keep my background image on bottom left all the time even if the user scroll the browser. My current css can make the image in the bottom of the browser when the site loaded, but if I scroll the browser, it will…
FlyingCat
  • 14,036
  • 36
  • 119
  • 198
11
votes
6 answers

Moving Background image in a loop from left to right

I would like to have a moving background image on my page from left to right exactly the same way as in following website http://kxip.in , please suggest how to achieve this. Thanks & Regards
user3378013
  • 111
  • 1
  • 1
  • 3
1 2 3
…
99 100