Menu
How Do i set background-position-x on Opera?
div#logocontainer{
width: auto;
height: auto;
text-align: center;
line-height: 200px;
overflow: auto;
margin-left: auto;
margin-right: auto;
background-image: url(../img/WatermarkMP.png);
background-repeat: no-repeat;
background-position-x: 50%;
background-position-y: 50%;
padding: 10px;
}
I have the following CSS rule, it will display correctly on Chrome and Safari, desktop and mobile versions. But it will not work on Opera, that does not seem to support the background-position-x: 50%; background-position-y: 50%; rules. Do I have to script this so that it's compatible with Opera? How do I work around this to support opera also?
It also does not seem to round jQuery Mobile corners...
605
The background-position-x CSS property sets the initial horizontal position for each background image. The position is relative to the position layer set by background-origin .
The background-position property sets the starting position of a background image. Tip: By default, a background-image is placed at the top-left corner of an element, and repeated both vertically and horizontally.
You can use a combination of position keywords: center , top , bottom , left and right . background-position: center center; The background image will be positioned in the center of the element.
background-position takes two arguments, an x-value and an y-value so to position it at the bottom, you would use: background-position: center bottom; .
You have to set background-position: 50% 50%. Those -x and -y properties are only supported in Internet Explorer and Webkit browsers.
122
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
