Question

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…

Answer 1

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