Se puede apuntar a Google Chrome?
-
20-09-2019 - |
Pregunta
necesito para posicionar este botón de actualización en www.euroworker.no/order (que tendrá que añadir un elemento al carrito, utilice el botón Kjøp agregar y Handlevogn para ver el carro). Funciona en FF y el IE. (Aunque hay otros problemas de alineación con IE) pero no en Chrome o Safari. Lo tenía trabajando antes, pero lo único que puedo pensar que hacer es Safari y Chrome objetivo. ¿Es esto posible?
Aquí está la CSS y HTML (Smarty) para usted.
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=""> </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}
Y el 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;
}
La necesidad de cambiar estos términos para Chrome y Safari.
Gracias.
Solución
@media screen and (-webkit-min-device-pixel-ratio:0) {
/*Chrome CSS here*/
#cartUpdate {
position:absolute;
width:160px;
height:30px;
left:660px;
bottom:40px;
}
}
Se ha solucionado el problema:)
Actualizar
Este recurso funciona mejor:. navegador CSS / JS selectores OS con
Otros consejos
Hay algunos hacks navegador disponibles para dirigir un navegador específico, algunos de ellos trabajará en todas las versiones del navegador, y alguien que no.
Esta es la lista de algunos cortes de los cromos de Google:
WebKit Hack:
.selector:not(*:root) {}
- Google Chrome Todas las versiones
- Safari Todas las versiones
- Opera : 14 y Posterior
- Android Todas las versiones
Soporta Hacks:
@supports (-webkit-appearance:none) {}
Google Chrome 28, Google Chrome y> 28, Opera y Opera 14> 14
- Google Chrome 28 y Posterior
- Opera : 14 y Posterior
Propiedad / Valor Hacks:
.selector { (;property: value;); }
.selector { [;property: value;]; }
Google Chrome 28, Google Chrome y <28, Opera y Opera 14> 14, y Safari 7 y menos de 7. - Google Chrome 28 y antes de - Safari 7 y antes de - Opera : 14 y Posterior
JavaScript Hacks: 1
var isChromium = !!window.chrome;
- Google Chrome Todas las versiones
- Opera : 14 y Posterior
- Android 4.0.4
JavaScript Hacks: 2 {Webkit}
var isWebkit = 'WebkitAppearance' in document.documentElement.style;
- Google Chrome Todas las versiones
- Safari 3 y Posterior
- Opera : 14 y Posterior
JavaScript Hacks: 3
var isChrome = !!window.chrome && !!window.chrome.webstore;
- Google Chrome 14 y Posterior
consulta de medios Hacks: 1
@media \\0 screen {}
- Google Chrome 22 a 28
- Safari 7 y versiones posteriores
consulta de medios Hacks: 2
@media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) { .selector {} }
- Google Chrome 29 y Posterior
- Opera 16 y Posterior
Para obtener más información, visite este sitio web