Preguntas etiquetadas con css

Estoy luchando con este problema desde hace bastante tiempo. El problema se puede ver en dispositivos móviles (Android e iOS), algunos dispositivos pueden necesitar un poco de acercamiento. En la PC, también puedo reproducir este error en el navegador Chrome cuando cambio al modo móvil. A continuación se muestra el …

23 html  css 

Estoy centrando un DIV dentro de otro DIV usando un flexbox. Piense en una ventana de diálogo que aparece en el centro de la pantalla cuando sea necesario. Funciona bien, sin embargo, se vería mucho mejor si el espacio arriba y abajo del diálogo no fuera exactamente igual, teniendo el …

23 html  css  flexbox  centering 

function validate() { var username = document.getElementById("username").value; var password = document.getElementById("password").value; if (username == "") { document.getElementById("message").innerHTML = "USERNAME CANNOT BE EMPTY"; document.getElementById("username").style.borderColor = "red"; return false; } if (password == "") { document.getElementById("message").innerHTML = "PASSWORD CANNOT BE EMPTY"; document.getElementById("password").style.borderColor = "red"; return false; } } #username:focus { background-color: yellow; …

20 javascript  html  css 

Por ejemplo, tengo esto: <pre> sun<br/>     mercury <br/>     venus <br/>         earth <br/>         mars <br/>             jupiter <br/>     saturn <br/> </pre> Ejecutar fragmento de códigoOcultar resultadosExpandir fragmento y esto: <div style="font-family:monospace"> <div style="text-indent: 0">sun</div> <br/> <div style="text-indent: 4ch">mercury</div> <br/> <div style="text-indent: 4ch">venus</div> <br/> <div style="text-indent: 8ch">earth</div> <br/> <div style="text-indent: 8ch">mars</div> <br/> <div …

19 html  css  acid3 

Tengo una lista, con el overflow-xy overflow-yestablecido en auto. Además, he configurado el desplazamiento de impulso, por lo que el desplazamiento táctil funciona bien en dispositivos móviles webkit-overflow-scrolling: true. El problema, sin embargo, es que no puedo entender cómo deshabilitar el desplazamiento horizontal al desplazarme verticalmente. Conduce a una experiencia …

17 javascript  html  css  angular  ionic-framework 

Estoy tratando de crear un sistema de menús con una imagen y texto arriba y abajo. Los datos son dinámicos. Quiero que el sistema de menús aparezca de modo que cada imagen esté a la misma distancia entre sí para que se alineen en una cuadrícula de imágenes tanto horizontal …

17 html  css  flexbox 

Quería hacer un círculo punteado con CSS y lo creé con el siguiente proceso. Aunque el círculo punteado podría mostrarse mediante este proceso, el espacio entre el final y el comienzo de la línea punteada se volvió estrecho y el espacio no fue uniforme. .c { width: 500px; height: 500px; …

16 javascript  html  css 

Tengo una tabla con números. Cuando hago clic en una celda de la tabla, alterna el estado activo. Quiero seleccionar una celda y presionar crtl y seleccionar otra celda, y como resultado las celdas entre la primera y la segunda se activarán. ¿Cómo implementarlo? codepen https://codepen.io/geeny273/pen/GRJXBQP <div id="grid"> <div class="cell">1</div> …

16 javascript  html  css 

He escrito un botón personalizado ( MyStyledButton) basado en material-ui Button . import React from "react"; import { Button } from "@material-ui/core"; import { makeStyles } from "@material-ui/styles"; const useStyles = makeStyles({ root: { minWidth: 100 } }); function MyStyledButton(props) { const buttonStyle = useStyles(props); const { children, width, ...others …

16 javascript  css  reactjs  jestjs  enzyme 

Estoy tratando de crear una animación de estilo de montaña rusa con CSS. Quiero saber cómo curvar la "montaña rusa" cuando está en la etapa de bucle. Estoy buscando una solución totalmente CSS, pero si necesito un poco de JavaScript, estoy de acuerdo con eso. mi código hasta ahora: #container …

15 html  css  css-animations  css-transforms 

Tengo el siguiente fragmento (necesito ver en modo de pantalla completa), que estoy tratando de colocar el <main>elemento directamente debajo del <header>elemento. Tengo la <header>posición fija porque quiero que permanezca en la parte superior de la pantalla mientras el usuario se desplaza por el contenido del <main>elemento. He intentado todo …

15 html  css  css-position  fixed 

¿Cómo hacer que un iframe responda, sin asumir una relación de aspecto? Por ejemplo, el contenido puede tener cualquier ancho o alto, lo cual es desconocido antes de la representación. Tenga en cuenta que puede usar Javascript. Ejemplo: <div id="iframe-container"> <iframe/> </div> Dimensione esto iframe-containerpara que el contenido apenas encaje …

14 javascript  html  css  iframe  responsive-design 

Cuando escribo el último número , el primer número va dentro de text-box(desaparece), agrega un espacio adicional. Después de hacer clic fuera, text-boxse ve bien, lo que necesito al escribir el último carácter. #number_text { padding-left: 9px; letter-spacing: 31px; border: 0; background-image: linear-gradient(to right, #e1e1e1 70%, rgba(255, 255, 255, 0) …

14 javascript  jquery  html  css 

Estoy trabajando en la tabla HTML e imprimiendo esa tabla en la impresora usando html-to-papervue.js, lo que estoy haciendo es hacer clic en agregar creando una nueva fila y luego en hacer clic en imprimir Estoy tratando de imprimir la tabla pero no está tomando cualquier dato que solo muestre …

14 javascript  css  vue.js  printing  vuejs2 

El efecto de relleno automático del navegador Chrome eliminó background-colory background-imagedesde UsernameyPassword campos de entrada. Antes de autocompletar Después de autocompletar Pero Chrome Browser autocompletar oculta mis íconos de las entradas y también cambia mi background-color. Así que necesito que mis iconos permanezcan en las entradas tal como están. ¿Es …

13 javascript  html  css  google-chrome