Perguntas com a marcação «css»

Eu tenho um aplicativo em que estou usando a UI do material e seu provedor de temas (usando JSS). Agora estou incorporando o fullcalendar-react , que não é realmente uma biblioteca React completa - é apenas um invólucro fino do componente React em torno do código original do fullcalendar. Ou …

9 css  reactjs  fullcalendar  jss 

Eu tenho uma tabela "classificável" onde o cabeçalho da coluna atualmente classificada exibe um ícone: O ícone de classificação deve ser exibido no final do texto (ou seja, apoiamos LTR / RTL). Atualmente estou usando display:flex. No entanto, se a largura da tabela diminuir e o texto do cabeçalho da …

9 html  css  layout  html-table  alignment 

Estou com problemas para tentar exibir meu conteúdo da barra lateral / navegação (usando o Bootstrap) para mostrar (ser expandido) por padrão na área de trabalho e fechado por padrão no celular e ter o ícone exibido apenas no celular. Parece que não consigo fazer isso funcionar. <nav class="menu menu-open" …

9 javascript  html  css  bootstrap-4  responsive-design 

Estou pensando em criar um editor com Slate ou ProseMirror e vendo algum comportamento estranho com o Chrome em torno da posição do cursor e da área de seleção ao usar um elemento embutido. O problema 1 é mostrado na primeira figura abaixo. Quando a posição do cursor de texto …

8 html  css  contenteditable  slatejs  prose-mirror 

Estou tentando obter um plano de fundo de vídeo em tela cheia para o meu Ionicaplicativo, ele funciona perfeitamente no Android e no navegador, mas quando executo o aplicativo em um iPhone no simulador Xcode, é apenas um plano de fundo branco e o vídeo não carrega . Código HTML: …

8 html  css  ios  cordova  ionic-framework 

Quando um usuário toca e mantém pressionado o gesto para selecionar uma palavra e, em seguida, arrasta o dedo na direção da borda superior ou inferior da tela, a página rola automaticamente para acomodar a seleção. aqui está um pequeno clipe demonstrando Eu gostaria de evitar esse comportamento dentro de …

8 javascript  html  css  swift  wkwebview 

Eu tenho esse código: .img-container { width: 300px; height: 300px; background-color: lightgreen; overflow: hidden; } .clipped-img { clip-path: url('#header-clip-svg'); } <div class="img-container"> <!--clipping SVG--> <svg height="0" width="0"> <defs> <clipPath id="header-clip-svg"> <path d="M199.6,18.9c-4.3-8.9-12.5-16.4-22.3-17.8c-11.9-1.7-23.1,5.4-32.2,13.2c-9.1,7.8-17.8,16.8-29.3,20.3c-20.5,6.2-41.7-7.4-63.1-7.5C38.7,27,24.8,33,15.2,43.3c-35.5,38.2-0.1,99.4,40.6,116.2c32.8,13.6,72.1,5.9,100.9-15c27.4-19.9,44.3-54.9,47.4-88.6c0.2-2.7,0.4-5.3,0.5-7.9C204.8,38,203.9,27.8,199.6,18.9z"></path> </clipPath> </defs> </svg> <!-- clipped image--> <img class="clipped-img" src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/3341051/team.jpg"/> </div> Executar snippet de códigoOcultar resultadosExpandir snippet Desejo aumentar …

8 css  svg  clip-path 

Vídeo demonstrando meu problema: https://i.imgur.com/L3laZLc.mp4 Eu tenho um aplicativo simples onde você pode adicionar cartões a 2 linhas diferentes. Quando um cartão é adicionado a uma linha, estou usando react-transition-grouppara acionar uma animação "enter". No entanto, também react-beautiful-dndinstalei para permitir o arrastamento de cartões entre as linhas e também para …

8 css  reactjs  animation  react-transition-group  react-beautiful-dnd 

Estou procurando fazer a transição de imagens com o zoom reduzido para a 2ª, 3ª imagem, etc. Tentei criar alguns quadros-chave por meio de imagem de fundo e escala, e funcionou decentemente, exceto que havia dois problemas. 1. Meu texto e botões também foram redimensionados, 2. a duração das imagens …

8 html  css 

Isso está dentro do projeto Bismon (um software GPLv3 + financiado por projetos europeus do H2020), git commit0e9a8eccc2976f . Este rascunho de relatório descreve o software. Esta questão fornece mais contexto e motivações. Trata -se do arquivo webroot / jscript / bismon-hwroot.js (escrito à mão) , usado em algumas páginas …

8 jquery  html  css  linux  html5-canvas 

No exemplo a seguir, o círculo se adapta à largura da grade e mantém sua proporção. À medida que a largura do recipiente diminui, os círculos diminuem com ele ... Porém, quando a altura é menor que a largura (segunda caixa), o círculo não diminui as sobreposições fora da grade. …

8 html  css  svg  css-grid  aspect-ratio 

Eu tenho elementos em uma página que são "focáveis" (botões, elementos com tabindex etc) e o leitor de tela lê o conteúdo muito bem. No entanto, eu tenho alguns outros elementos que não são focáveis ​​(devido ao fato de existirem muitos deles - resultados da lista suspensa etc.), então eu …

8 javascript  html  css  wai-aria 

Eu tenho uma div que contém uma imagem e algum texto (a imagem é do tamanho variável e o texto é do tamanho variável). Existe alguma maneira de calcular a altura necessária para caber todo o conteúdo div, considerando que a largura exata é predefinida? UPD obtendo o mesmo resultado …

8 javascript  css 

Aprendi a usar animação em css usando @keyframe. No entanto, eu quero escrever meu código de animação personalizado no meu projeto de reação (Using materialUI). Meu desafio é como posso escrever o código javascript para personalizar minhas animações usando o makeStyle () no MaterialUI. Quero poder personalizar os processos de …

8 css  reactjs  material-ui  jss 

Atualmente, estou lutando com uma maneira de substituir os ícones de reprodução / pausa por texto, mantendo a animação de alternância. Estou tentando entender exatamente qual código JS está processando os ícones e depois removê-los / ocultá-los para que eles possam ser substituídos por texto Ainda sou iniciante em JS, …

8 javascript  jquery  css