Eu tenho um site para montar que tem uma proporção fixa de aproximadamente 16:9paisagem, como um vídeo. Quero centralizá-lo e expandi-lo para preencher a largura e a altura disponíveis, mas nunca aumentar em ambos os lados. Por exemplo: Uma página alta e fina teria o conteúdo esticando toda a...
Tenho um site que deve ser responsivo para celulares. Eu criei usando meu desktop. Quando ajusto as janelas do navegador, ele está funcionando perfeitamente para o celular, mas quando eu verifico no meu celular real: o Samsung Galaxy S2 não responde à visualização do celular. O que pode estar...
O objetivo é fazer com que o <svg>elemento seja expandido até o tamanho de seu contêiner pai, neste caso a <div>, não importa o quão grande ou pequeno esse contêiner seja. O código: <style> svg, #container{ height: 100%; width: 100%; } </style> <div...
Preciso adicionar recursos de design responsivo ao meu aplicativo da web usando o Twitter Bootstrap. Eu só quero o comportamento responsivo, não estou interessado na tipografia, componentes ou qualquer outra coisa incluída no Bootstrap. Eu tenho uma versão customizada do Bootstrap apenas...
Dado que o Twitter Bootstrap foi projetado para ser responsivo / amigável ao dispositivo, por que ele não usa tamanhos de fonte
Isso pode soar como uma pergunta boba. Se eu usar este snippet CSS para monitores regulares (onde box-bg.pngé 200px por 200px); .box{ background:url('images/box-bg.png') no-repeat top left; width:200px; height:200px } e se eu usar uma consulta de mídia como esta para visar telas de retina...
Eu tenho este código: <footer class="row"> <nav class="col-sm-3"> <ul class="list-unstyled"> <li>Text 1</li> <li>Text 2</li> <li>Text 3</li> </ul> </nav> <nav class="col-sm-3"> <ul class="list-unstyled">...
Estou tentando criar uma forma como na imagem abaixo com uma borda inclinada em apenas um lado (por exemplo, o lado inferior) enquanto as outras bordas permanecem retas. Tentei usar o método de borda (o código é fornecido abaixo), mas as dimensões da minha forma são dinâmicas e, portanto, não...
EDITADO: Talvez eu deva perguntar qual seletor configura o padding lateral quando a tela é reduzida para menos de 480px de largura? Eu tenho navegado bootstrap-responsiveness.css por um tempo para localizar isso, mas nada parece afetar isso. Original , basicamente, desejo remover qualquer...
Atualmente, tenho algo como: <div class="row"> <div class="col-md-4">Content</div> <div class="col-md-4">Content</div> <div class="col-md-4">Content</div> <div class="col-md-4">Content</div> <div
Como espaçamos as consultas de mídia com precisão para evitar sobreposições? Por exemplo, se considerarmos o código: @media (max-width: 20em) { /* for narrow viewport */ } @media (min-width: 20em) and (max-width: 45em) { /* slightly wider viewport */ } @media (min-width: 45em) { /*...
Desde o Bootstrap 3 não há mais arquivos separados para folhas de estilo responsivas e padrão. Então, como posso remover facilmente os recursos responsivos?
Como tornar um iframe responsivo, sem assumir uma proporção? Por exemplo, o conteúdo pode ter qualquer largura ou altura desconhecida antes da renderização. Observe que você pode usar Javascript. Exemplo: <div id="iframe-container"> <iframe/> </div> Dimensione isso...
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...