0

Hi I have some troubles with a "margin" in mozilla, explorer, safari and chrome for IOS.

For Mozilla and Explorer I solved with

/*Styles for Firefox*/
@-moz-document url-prefix() {
    .box img {
        width: 100%;
    }

.box .info{
    margin-left: -70% !important;}
}

/* Styles for IE10*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .box img {
        width: 100%;
    }

    .box .info{
   margin-left: -70% !important;}
}

What about Safari?

B_etta
  • 117
  • 2
  • 17
  • Exactly what you're trying to achieve, your piece of *code* is not enough to understand the problem. – vivekkupadhyay Sep 30 '15 at 10:36
  • 1
    I happened upon this the other day - might be useful http://stackoverflow.com/questions/23300412/target-safari-css-but-not-chrome – Mick m Sep 30 '15 at 10:44
  • @vivekkupadhyay I need to call in CSS some rules only for Safari desktop, Chrome on IOS mobile and Safari on IOS mobile. – B_etta Sep 30 '15 at 14:13
  • @Mickm It Your suggestion worked for "Safari desktop" but I still have this problem with Safari on mobile and Chrome on IOS mobile. Do you have any suggestion? Thank you – B_etta Sep 30 '15 at 14:15

1 Answers1

0

Should work for Safari 6.1+, amend your styles to suit:

@media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0) { @media
{
    .box img {
        width: 100%;
    }

.box .info{
    margin-left: -70% !important;
    }
}}
RichTea
  • 1,462
  • 10
  • 16
  • 24