How-to set background-position-x?


Tags: css,css3,opera

Problem :

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...



Solution :

You have to set background-position: 50% 50%. Those -x and -y properties are only supported in Internet Explorer and Webkit browsers.


    CSS Howto..

    How to add and remove background images in css on clicking a link on page

    How to set CSS rule for a DIV in a LI of class UL?

    How to add new value to current css value [closed]

    How to style a built-in comment box imported from a third party?

    How to stretch text in CSS like microsoft word?

    How can I make a div element float left after another float left while still filling the rest of the parent's width?

    How can I select the first IFRAME within the second FB tag in a div?

    simplecart.js Images not Showing in IE8 on blogger.com site

    How to always center a flexible square in viewport with pure CSS?

    How to access css selector properties after getting access to selector

    How To Left Align the Title Using CSS

    How to use jQuery / CSS to swap out the contents of a DIV onmouseover on list items? [closed]

    How to rotate a line(x1=50,y1=50,x2=50,y2=10) with respect to x=50,y=50 as center using CSS?

    Using Javascript or JQuery to show/hide on click, and change image as well

    How to reorder DOM elements with CSS only?

    How to add font awesome in CSS

    How to make an element match the height of a dynamic page

    How to cover box shadow?

    How to disable CSS editor in Netbeans 7

    css/jquery - how to hide last row of floated elements if not even

    How can I target an id=“last_name[]_field” with css

    how to make div with image like below in html and css

    How do I set the width and height of a textarea using CSS?

    Showing an hidden element with an opacity-animation

    How to use css image sprites in this code?

    How to not inherit CSS styles from parents? [duplicate]

    How to unbind element then allow that element to bind again

    How to add spacing to text start in css

    How to make divs appear and disapear on hover in css?

    How to Convert RGB to HEX ( for Gradients )