Questions tagged [background-position]

CSS property that sets the initial position, relative to the background position layer defined by background-origin for each defined background image

CSS property that sets the initial position, relative to the background position layer defined by background-origin for each defined background image.

Examples

.exampleone {
  background-image: url("logo.png");
  background-position: top;
}

.exampletwo {
  background-image: url("logo.png");
  background-position: 25% 75%;
}

References

  1. background-position - W3C Specification
  2. background-position - MDN Link
381 questions
0
votes
1 answer

css background position X important

There are belive to set background-position X to 0 with flag !important and background position Y without !important? For example: background-position-x: 0 !important; background-position-y: 10%;
0
votes
1 answer

position background image in ie9 using filter

I have a div with a gradient background as well as a background image. It works great in all the major browsers except ie9. I have both displaying, however I can't figure out how to position the background image. using the appropriate browser…
0
votes
2 answers

Posistion a background image into its own element's margin - Is this Possible?

I have anchor item with margins around it. I want to posistion a bg image in the margin. Can you do this? It works with padding, but want to use margin. To note jquery is adding in the .active class to the link. Maybe using…
RooksStrife
  • 1,647
  • 3
  • 22
  • 54
0
votes
1 answer

Align fixed background with CSS calc

I hope what I try is not impossible. Let me explain first: I have a responsive design which requires a background to be fixed under some situations (media query blocks). The design in question is this…
0
votes
1 answer

How do I use css to set a background image using the cover property on a div, not the body?

I have a div, .cover-section, that I want to have a full background image that is the size of the viewport. I want to use the cover css property. I have got this working for the body of the page, but if I add more content and try to scroll, the…
jdc987
  • 743
  • 3
  • 10
  • 20
0
votes
2 answers

Animation of multiple background image positions via keyframes works in Chrome & Safari but not Firefox

The goal is to create an infinitely scrolling, two-layer parallax background. The effect works perfectly in Mac Chrome and Safari, but it stutters in Firefox. Any ideas why? Thanks!