CSS funktioniert nicht im Safari - OK in Chrome, Firefox

Meine website ist http://proustscookies.blogspot.com/. Ich bin auf das styling der buttons befestigt, um das Such-Formular mit CSS.

Hier ist der CSS:

input.gsc-search-button {
margin-left: 10px;
height: 24px;
width: 60px;
border-style: none;
background-color: #666666;
font-family: Helvetica, Arial, sans-serif;
font-size: 13px;
color: #FFFFFF;
}

Den margin-left-Befehl funktioniert wunderbar in Firefox und Chrome, jedoch nicht in Safari.

Allen anderen CSS-Regeln (oben und auf der gesamten Website, Daten nicht gezeigt) arbeiten in allen drei Browsern (und letztes mal habe ich überprüft, auch im IE).

Fand ich den Namen des Objekts (input.gsc-search-button) mit der Chrome-Erweiterung Stylebot. Leider kann ich nicht finden, die zugrunde liegenden html-Code überall (Das ist ein blogger-sponsered-widget. Könnte Google versteckt den code irgendwo? Ich weiß es nicht.)

Wenn jemand mir helfen könnte herauszufinden, warum die Marge nicht angezeigt, in Safari, oder wie finde ich den html-Code für das Suchfeld, würde ich es sehr schätzen.

für mich, es funktionierte, wie es sollte auf chrome und firefox, aber in safari ist es erforderlich, 1 extra pixel. (-1px-Rand in meinem Fall so -35px drehte sich um -36px). hoffe, dies hilft jemand

InformationsquelleAutor mm524 | 2013-03-08

  1. 2

    Es ist überschrieben von google.
    Wenn Sie das tun:

    margin-left: 10px!important;

    Können Sie überschreiben.

    Oder Sie könnten Ihre Selektor spezifischer (und damit geben Sie den Vorrang) von etwas wie

    td.gsc-search-button input.gsc-search-button {
   margin-left: 10px;
}

    Hinweis: Sie können der rechten Maustaste auf ein element (in firefox oder chrome) und klicken Sie auf "element untersuchen", um zu sehen, die css für dieses element.

    InformationsquelleAutor Jared Forsyth

  2. 0

    Ich hatte ein ähnliches Problem, wo alle Stile wurden korrekt übernommen, außer auf mobile safari, sehr seltsam. Er arbeitete sogar auf desktop-safari!

    In das Ende, ich fixierte es mit genauer Ausrichtung. Ich hatte diese vor:

    .phone{
  background-color:gray;
}

    Diese änderung behoben.

      div.phone {
    background-color:gray;
  }

    Durch die Art und Weise, habe ich es herausgefunden mit Inspektor auf mobile safari. http://webdesign.tutsplus.com/articles/quick-tip-using-web-inspector-to-debug-mobile-safari--webdesign-8787

    InformationsquelleAutor littlequest

Schreibe einen Kommentar