29
votos
Aceito
Qual a diferença entre col-lg-* , col-md-* e col-sm-* no Bootstrap?
Na própria documentação do Bootstrap há uma tabela comparativa entre as classes de grid.
Ou seja, a classe .col-xs-* definem o grid para dispositivos com largura de tela inferior à 768px. A classe ....
- 75,6mil
7
votos
Qual a diferença entre col-lg-* , col-md-* e col-sm-* no Bootstrap?
Agora com a versão oficial do Bootstrap sendo a versão 4, acredito que a resposta mereça um update.
Segue o link da documentação oficial do grid da verão 4: https://getbootstrap.com/docs/4.0/layout/...
- 66,5mil
6
votos
Como criar "grid" com elementos flutuantes semelhante ao Pinterest
Para fazer isso tens que utilizar a propriedade column-count em vez do float:left; como no exemplo abaixo. Esta propriedade divide o conteúdo dentro de uma div no qual esta propriedade é atribuída, em ...
- 7.496
5
votos
Aceito
Como funciona as utilidades responsivas do Bootstrap?
Se você der uma olhada no css do bootstrap notará o seguinte código:
@media (max-width: 767px) {
.hidden-xs {
display: none !important;
}
}
@media (max-width: 767px) {
.visible-xs {
...
- 16,1mil
5
votos
Aceito
Como validar campos do DBGrid antes de salvar?
Fazer isso no evento TDataSet.BeforePost não é má ideia, porém como você quer validar os campos em especifico, o evento DB.TField.OnValidate pode servir melhor para esse caso.
Para utilizar esse ...
- 30,8mil
5
votos
Aceito
Como eu faço esse painel com sistema de grid bootstrap?
Como você não disse se vai ser dinamico ou nao, a quantidade de blocos, considerei uma quantidade fixa igual a do exemplo.
Mas acredito que o segredo é definir um tamanho minimo nos blocos, os que ...
- 2.505
5
votos
Aceito
Estilização de Grid para galeria usando display flex
Um exemplo bem simples é criar um "div pai":
/*o BODY no doctype HTML5 ou Strict não ocupa 100%, então isso deve ajustar*/
html, body {
height: 100%;
}
.flex-parent {
display: -...
- 100mil
5
votos
Aceito
FlexBox + CSS GRID
Sim meu amigo é perfeitamente viável usar display:grid e display:flex no mesmo projeto. Principalmente pelas particularidades de cada um. Falando a grosso modo o Grid vc pode usar mais para montar a ...
- 66,5mil
5
votos
Por divs ao lado com bootstrap
Vc pode pegar a .row do meio e colocar uma classe .centro nela. Depois vc composition:absolute vc coloca ela "flutuando" por cima das outras, e alinha ela verticalmente com top e transform:translateY()...
- 66,5mil
4
votos
Qual a diferença entre col-lg-* , col-md-* e col-sm-* no Bootstrap?
São atributos do bootstrap que definirão o tamanho do grid, em relação ao tamanho do dispositivo, são breakpoints :
col-xs-* extrasmall < 768 px
col-sm-* small >= 768 px
col-md-* medium >= ...
- 12,5mil
4
votos
Aceito
Criação de Galeria CSS
Seria isso?
Para aumentar o tamanho da galeria, é só aumentar o tamanho a <div id="galeria">
E relembrando que o seletor not exclui um elemento da seleção como, todos os blocos possuem o mesmo ...
- 3.276
4
votos
Aceito
Como faço para trocar o conteúdo de um UserControl, utilizando um botão em outro UserControl?
Como já tem uma resposta utilizando code-behind, vou dá uma solução utilizando MVVM.
A propriedade que você quer preencher se chama "content". Devemos conecta-la a uma propriedade da ViewModel que ...
- 341
4
votos
Aceito
Como funciona o Grid System no Angular Material Design?
Você pode usar o Material Grid List, para fazer um layout de colunas de forma responsiva em conjunto com o Angular Flex Layout, mas você vai precisar de um pouco de código.
TL;DR; Va para o link de ...
- 2.853
3
votos
Aceito
Como calcular colunas igual a do Skeleton
Realmente, é um enigma meio complexo de se resolver. Depois de alguns testes e algumas pesquisas, não foi possível obter o resultado de 4.66..67%, porém cheguei em 4,25%.
De acordo com esse problema ...
- 8.168
3
votos
Tamanho da coluna GRID Bootstrap - Valor customizado
Obrigado a todos mas acabei resolvendo adicionando um stylezinho ... como é um ponto especifico ficou mais fácil e simples esta solução ..
3
votos
Como recarregar grid sem precisar verificar se ela existe JS JQuery
Editado depois do comentário:
Você pode inicializar grids no começo do script como um objeto global que vai reunir todos os grids que existem. Sempre que você definir um grid, crie uma propriedade ...
- 4.025
3
votos
Aceito
Grid 960 menor que a tela
Para atingir sempre a largura total da tela, você precisaria adaptar este grid para porcentagem, recalculando os PX em %.
Algo do tipo:
.container_16 {width:100%}
.grid_1 {width:6.25%} /* 100% / 16 *...
- 69
3
votos
Grid do Bootstrap não funciona!
Você deve utilizar o Bootstrap 4 pra usar os sufixos classes -xl . Ainda, você deve observar se as outras classes adicionadas ao elemento (wow e bounceInLeft) não possuem atributos CSS como float e ...
- 145
3
votos
Aceito
Grid do Bootstrap não funciona!
Poderá adicionar a classe col-lg-* para ecrãs com largura superior a 1200px.
Se for o XS que não funciona, o problema poderá estar relacionado com a dimensão das imagens. Se a largura da imagem for ...
- 466
3
votos
Grid do Bootstrap não funciona!
Lucas acho que vc está se confundindo um pouco entre as Classes do Bootstrap3 e Bootstrap4, a culpa não é sua, pq as vezes pesquisamos no Google e clicamos no link sem percebemos na Documentação de ...
- 66,5mil
3
votos
Aceito
Matriz hexagonal em Python
Como você mesmo pode perceber, por dentro do Python, você não vai usar uma "matriz hexagonal" - vai usar uma estrutura bidimensional mesmo.
O que você precisa é uma forma de (1) percorrer as ...
- 31,3mil
3
votos
Aceito
Flutuar elementos com CSS Grid
Vc precisa ajustar a propriedade grid-auto-flow para row dense, assim todo elemento do Grid vai tentar se ajustar nos espaços em "vazios"
Aqui vc pode ler e ver alguns exemplos práticos do grid-auto-...
- 66,5mil
3
votos
Aceito
Ajuda com centralização de itens de uma grid
Não sei se entendi direito, mas já que vc está usando Grid sugiro vc a usar um display: grid; e align-content: center; na div pai #grid-container e também colocar uma altura no form e ul, pois o filho ...
- 66,5mil
3
votos
Aceito
<footer> só ocupa as 3 primeiras colunas criadas no CSS Grid. Como faço para ocupar as 4 colunas da tela?
footer está com o atributo grid ao invés de grid-area, este é o problema!
body {
margin: 0;
padding: 0;
box-sizing: border-box;
background-color: white;
}
div.container {
...
- 323
3
votos
Aceito
Grid no R não funciona
O argumento panel.first é avaliado de forma preguiçosa ("lazy"), o que traz algumas limitações. Uma delas é que ele não funciona quando se usa fórmula para especificar o gráfico. A solução ...
- 7.581
3
votos
Aceito
Dúvida em relação ao CSS Grid e Firefox
Grid ainda é meio bizarro com algumas coisas, mas inicialmente por incrível que pareça o comportamento do Chrome está certo, pois ele que está fazendo a proporção correta 20/80. (Se você observar é ...
- 66,5mil
2
votos
Aceito
Grid System BootStrap
O que eu fiz foi colocar uma row no em cada conjunto imagem+texto do último lance de imagens:
<div class="col-xs-4">
<div class="row"> <!-- Adicionei esta div para juntar ...
- 11,5mil
2
votos
Aceito
Qual a diferença e quando usar o Flexbox ou CSS Grid?
Se usa mais o GRID para toda a página (o < body > todo). Vai dividir a página completa em linhas e células (como se fosse uma grande planilha Excel). Esse GRID foi [inter-] invenção da Microsoft. ...
- 92
2
votos
Aceito
Flexbox substitui as GRID?
Conceitos
Flexbox:
Faz parte da especificação do CSS3 que promete organizar elementos na
página previsivelmente quando o layout precisa ser visualizado em
diversos tamanhos de tela e em ...
- 9.116
Only top scored, non community-wiki answers of a minimum length are eligible
Tags relacionadas
grid × 132css × 57
html × 32
html5 × 15
css3 × 15
twitter-bootstrap × 15
flexbox × 12
bootstrap × 10
javascript × 9
c# × 9
delphi × 8
bootstrap-3 × 8
layout-responsivo × 8
php × 5
jquery × 5
layout × 5
angularjs × 4
front-end × 4
bootstrap-4 × 4
python × 3
r × 3
aplicação-web × 3
imagem × 3
mobile × 3
wpf × 3