Frage

Ich brauche dieses Update-Taste auf www.euroworker.no/order positionieren (Sie werden einen Artikel in den Warenkorb gelegt haben hinzuzufügen, verwenden Sie die Kjøp Schaltfläche hinzufügen und Handlevogn den Wagen zu sehen). Arbeiten in FF und IE. (Zwar gibt es eine weitere Ausrichtungsprobleme mit IE), aber nicht in Chrome oder Safari. Ich hatte es vor der Arbeit, aber das einzige, was ich tun denken kann, ist Ziel Safari und Chrome. Ist das möglich?

Hier ist die CSS und HTML (Smarty) für Sie.

HTML (Smarty):

    {capture assign="cartUpdate"}

     <div id="cartUpdate"><!--<input type="submit" class="submit" value="{tn _update}" />-->
     <button type="submit" class="submit" id="oppdatersubmit" name="saveFields" title="Oppdater" value="">&nbsp;</button> </div>
    {/capture}
    {assign var="cartUpdate" value=$cartUpdate|@str_split:10000}
    {php}$GLOBALS['cartUpdate'] = $this->get_template_vars('cartUpdate'); $this->assign_by_ref('GLOBALS', $GLOBALS);{/php}

    {form action="controller=order action=update" method="POST" enctype="multipart/form-data" handle=$form id="cartItems"}

CONTENT

{/form}

Und die CSS:

#oppdatersubmit {
 background-image:url(../../upload/oppdater.png);
 background-repeat:no-repeat;
 background-position:left;
 background-color:none;
 border:none;
 overflow:hidden;
 outline:none;
    white-space: nowrap;
 width:77px;
 height:25px;
 cursor:pointer;
 position:absolute;
}

#cartUpdate {
 position:absolute;
 width:160px;
 height:30px;
 left:580px;
 bottom:130px;
}

Notwendigkeit, diese für Chrome und Safari zu ändern.

Danke.

War es hilfreich?

Lösung

@media screen and (-webkit-min-device-pixel-ratio:0) {

    /*Chrome CSS here*/

    #cartUpdate {
        position:absolute;
        width:160px;
        height:30px;
        left:660px;
        bottom:40px;
    }
}

das Problem behoben:)

UPDATE

Diese Ressource besser funktioniert. CSS-Browser / OS-Selektoren mit JS

Andere Tipps

Es gibt einige Browser-Hacks für einen bestimmten Browser-Targeting, einige von ihnen werden die Versionen des Browsers auf alle arbeiten, und einige man sich nicht.

Hier ist die Liste von einigen das Google Chromes des Hacks:

WebKit Hack:

.selector:not(*:root) {}
  • Google Chrome : Alle Versionen
  • Safari : Alle Versionen
  • Oper : 14 und höher
  • Android : Alle Versionen

Unterstützt Hacks:

@supports (-webkit-appearance:none) {}

Google Chrome 28 und Google Chrome> 28, Opera 14 und Opera> 14

  • Google Chrome : 28 und höher
  • Oper : 14 und höher

Eigenschaft / Wert Hacks:

.selector { (;property: value;); }
.selector { [;property: value;]; }

Google Chrome 28 und Google Chrome <28, Opera 14 und Opera> 14 und Safari 7 und weniger als 7.  - Google Chrome : 28 und vor dem  - Safari : 7 und vor dem  - Oper : 14 und höher

JavaScript Hacks: 1

var isChromium = !!window.chrome;
  • Google Chrome : Alle Versionen
  • Oper : 14 und höher
  • Android : 4.0.4

JavaScript Hacks: 2 {Webkit}

var isWebkit = 'WebkitAppearance' in document.documentElement.style;
  • Google Chrome : Alle Versionen
  • Safari : 3 und höher
  • Oper : 14 und höher

JavaScript Hacks: 3

var isChrome = !!window.chrome && !!window.chrome.webstore;
  • Google Chrome : 14 und höher

Medien Abfrage Hacks: 1

@media \\0 screen {}
  • Google Chrome : 22-28
  • Safari : 7 und höher

Medien Abfrage Hacks: 2

@media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) { .selector {} }
  • Google Chrome : 29 und höher
  • Oper : 16 und höher

Weitere Informationen finden Sie unter diese Website

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top