{"id":12182771,"date":"2020-08-13T15:32:04","date_gmt":"2020-08-13T15:32:04","guid":{"rendered":"https:\/\/es.wordpress.org\/support\/topic\/error-diseno-responsive\/"},"modified":"2020-08-13T15:32:04","modified_gmt":"2020-08-13T15:32:04","slug":"error-diseno-responsive","status":"publish","type":"topic","link":"https:\/\/es.wordpress.org\/support\/topic\/error-diseno-responsive\/","title":{"rendered":"Error dise\u00f1o responsive"},"content":{"rendered":"<p>Buenas tardes,<\/p>\n<p>He estado modificando el CSS sobre el plugin de Woocommerce en el tema de la p\u00e1gina de un cliente y tengo problema con el <em>dise\u00f1o responsive<\/em>. Utilizo siempre el inspector de elementos para hacer pruebas y luego traslado los cambios a un notepad y, por \u00faltimo, al tema mismo. <\/p>\n<p>El problema reside en cuanto reviso el dise\u00f1o aplicado a dispositivos m\u00f3viles. En unos dispositivos todo se genera correctamente (Moto G4, Galasy S4), mientras que en otros aparecen elementos desbordados (Pixel y versiones muy concretas de Iphone). Me gustar\u00eda saber por qu\u00e9 ocurre esto.<\/p>\n<p>Actualmente, tengo definido las media qerys de la siguiente manera.<\/p>\n<pre><code>@media only screen and (max-device-width: 450px) and (min-device-width: 300px) and (min-device-height: 500px) { \n\t\n\t.woocommerce {\n    display: block;\n    position: relative;\n}\n\n\tp.woocommerce-notice.woocommerce-notice--success.woocommerce-thankyou-order-received {\n    padding-bottom: 1.2em;\n    font-size: 16.5px;\n}\n\nul.woocommerce-order-overview.woocommerce-thankyou-order-details.order_details {\n    display: block;\n    border: 1px solid rgba(0,0,0,0.4);\n    box-shadow: 1px 0.5px 4px 0.5px;\n    border-radius: 5px;\n    border-collapse: collapse;\n    width: 100%;\n    height: 350px;\n    position: relative;\n    text-align: left;\n\tleft: 2%;\n }\n}<\/code><\/pre>\n<p>Gracias por su respuesta.<\/p>\n","protected":false},"template":"","class_list":["post-12182771","topic","type-topic","status-publish","hentry","topic-tag-diseno-responsive","topic-tag-elementos","topic-tag-inspector"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/es.wordpress.org\/support\/wp-json\/wp\/v2\/topic\/12182771","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/es.wordpress.org\/support\/wp-json\/wp\/v2\/topic"}],"about":[{"href":"https:\/\/es.wordpress.org\/support\/wp-json\/wp\/v2\/types\/topic"}],"version-history":[{"count":0,"href":"https:\/\/es.wordpress.org\/support\/wp-json\/wp\/v2\/topic\/12182771\/revisions"}],"wp:attachment":[{"href":"https:\/\/es.wordpress.org\/support\/wp-json\/wp\/v2\/media?parent=12182771"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}