background-position Questions

7

Solved

I have 3 a tags disguised as "roll over buttons". <div id="buttons"> <a class='button' id='but1' href=''></a> <a class='button' id='but2' href=''></a> <a class=...
Privatdocent asked 18/5, 2011 at 0:35

2

Is there any way to make background-position take percentage values? Currently my button only works with an explicit values for width and background-position. body { min-height: 100vh; dis...

1

Solved

I have the following shimmer effect working very well when used on a p element but it doesn't work on any div nor an img. So, what modifications should I make to make sure the shimmer effect plays ...

9

Solved

I've got three background images, all of width 643px. I want them to be set out like so: top image (12px height) no-repeat middle image repeat-y bottom image (12px height) no repeat I can't see...
Chema asked 2/5, 2012 at 16:5

3

Solved

Everywhere I read says this should be working fine, but for some reason it's not. This was to fix someone else's issue so fixing it doesn't matter to me, I just want to know why. The proble...
Irritant asked 8/7, 2015 at 12:7

1

Solved

inb4: Sorry for the horribly oversized images that takes super long to load, click on the links and read the question after if you dont like to wait! So I'm making this prototype of a site where I...

1

I'd like to use a font character (e.g. from font-awesome) as a background-image of an input element. <style> #id { background-image: content('\f2d3'); /* content instead of url() */ backgro...
Eleonoraeleonore asked 4/11, 2016 at 14:50

2

Solved

I am using a background-image SVG sprite, and everything looks great on my versions of Safari, mobile Safari, Chrome, Firefox, Opera, IE, etc. However, the background positions aren't displaying co...
Unaneled asked 1/7, 2014 at 19:27

5

The following code renders well in IE9, FireFox, Chrome, but not in Safari: .search-choice { position: relative; background-clip : padding-box; background-image: url('../Design/icon_chosen_clos...
Pontius asked 14/5, 2013 at 11:31

2

Solved

I need to position my background at the bottom of the screen. But on mobile device resolution I want to display it 100px lower than that, like "bottom minus 100px". Is it possible to achieve such a...
Audreyaudri asked 8/1, 2016 at 13:48

6

Solved

I have play with youtube's sprite animation but there is a problem. backgroundPositionX won't work under Firefox (but works on Chrome and IE8)... This is the code: https://jsfiddle.net/74RZb/ Ext...
Macdermot asked 19/12, 2012 at 8:55

3

Solved

I know I can set a negative left position on a background image like this: #element { background: url(image.png) -20px 0 no-repeat; } That'll position the background image 20px to the left of t...
Sthenic asked 28/1, 2013 at 19:27

12

I can't seem to get this working. $('#product_family_options_dd').animate({ height: '300px', width: '900px', backgroundPosition: '-20px 0px', }, The height and width animate but not the back...
Bircher asked 2/3, 2011 at 17:24

5

I have an issue with background-position in mobile safari. It works fine on other desktop browsers, but not on iPhone or iPad. body { background-color: #000000; background-image: url('images/bac...
Hesperian asked 6/7, 2010 at 4:16

5

Solved

I'm searching for a trick that repeat my background image vertically, but every time the image is repeated I want to flip it vertically. I tried all the things in my mind with repeat-y but I don't...
Artema asked 30/7, 2013 at 14:13

3

Solved

I'm currently playing around with CSS gradients and position, I kind of manage to do what I want but with lucky guesses but I'd like to understand how this actually all works. For instance, ...
Aviva asked 3/9, 2014 at 15:28

3

Solved

I'm worried about background-position-x and background-position-y. Gecko (Firefox) and Presto (Opera) don't support them, but Webkit (Chrome, Safari) does... Does anyone know (with official refere...
Macswan asked 11/3, 2012 at 9:3

5

Solved

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 st...
Amerce asked 1/4, 2014 at 9:19

1

Solved

I have my site set up in 'page-sections' for a vertical scroll. the first page-section is 100% width and height, as are the other sections, but has a background image that scrolls and stretches to ...
Wasson asked 26/2, 2014 at 23:2

6

Solved

I've a sprite of 62 images of 91 * 91px, which makes the whole thing 91 * 5642 px. They're displayed in sort of a dynamic grid that grows and shrinks depending on user/pointer movement. Sometimes a...
Cleon asked 10/6, 2013 at 22:24

3

Solved

I have to do the following: The top of the div is an image of a gradient, then in the bottom it continues as a solid color. Can I do this with simple CSS? I know the following is invalid. {backgro...
Dishrag asked 29/7, 2013 at 12:43

5

Solved

I got this background image slider thing working in chrome and safari, but it doesnt do anything in firefox. any help? $(function(){ var image= ".main-content"; var button_left= "#button_left"; ...
Radiometeorograph asked 1/4, 2011 at 21:4

11

Solved

I get this problem in IE7 when running a piece of code that uses jquery and 2 jquery plugins. The code works in FF3 and Chrome. The full error is: Line: 33 Char: 6 Error: bg is null or not an o...
Satchel asked 27/2, 2009 at 14:1

5

Solved

I'm working on an HTML email. The problem I get is that GMAIL doesn't use the "background-position" i give it. I have a table with 100% width that has a background that has to be centered. Most cli...
Bister asked 19/3, 2012 at 9:57

3

Solved

I need to have an image at the top-center of a web page in css. Now, Im just using the background-image: in css but this puts it at the middle of the page. Here's my code: body { background-imag...
Ratepayer asked 20/5, 2010 at 23:34

© 2022 - 2024 — McMap. All rights reserved.