Siga-nos em...
Follow us on Twitter Follow us on Facebook Watch us on YouTube
Registro


HGIDC
Resultados 1 a 8 de 8
  1. #1

    Avatar de [ADM]Lp
    Data de Ingresso
    Sep 2011
    Localização
    Magé
    Idade
    24
    Posts
    543
    Agradecido
    91
    Agradeceu
    63
    Peso da Avaliação
    12

    Question Responsividade Bootstrap

    Olá pessoal tudo beleza?

    Bom a pouco tempo resolvi me aventurar em HTML/CSS usando o Bootstrap, surgiu uma oportunidade em fazer a WEB de onde trabalho e então decidi abraçar.

    Já fiz alguns rabiscos, nada definido e finalizado, mais um esboço, entretanto estou com um problema na hora da renderização em dispositivos móveis, o que ocorre:

    1º Quando o site é acessado por dispositivos móveis, o MENU se adapta e sobrepõe o slider "Carousel";
    2º O Texto, titulos, e glyphicons se adaptam normalmente, entretanto ele não consegue renderizar o estilo que foi definido no arquivo ".CSS";

    Eu ja vi, revi, vi novamente e não consigo encontrar onde esta o "meu" erro. Se alguém puder me dar uma ajudinha ficarei grato.

    Para ver o que ocorre acesse aqui:

    [Somente usuários registrados podem vem os links. ]

  2. #2


    Avatar de Litlle
    Data de Ingresso
    Jul 2010
    Localização
    Bh
    Idade
    26
    Posts
    255
    Agradecido
    231
    Agradeceu
    78
    Peso da Avaliação
    12

    Padrão

    Não sou o melhor dos front, mas manjo alguma coisa kkkk

    1º = Você pode usar Media Queries pra determinar o margin nos dispositivos mobiles
    Ex:
    Código PHP:
    <style>
      
    body {
        
    padding-top60px;
      }
      @
    media (max-width980px) {
        
    body {
          
    padding-top0;
        }
      }
    </
    style
    2º = O Seu .css tem que ficar apos o css do bootstrap...
    Ex:
    Código PHP:
    <link href="bootstrap">
    <
    link href="SeuCss"
    Última edição por Litlle; 25-08-2015 às 12:12 PM.

  3. #3

    Avatar de Sudeikis
    Data de Ingresso
    Mar 2014
    Localização
    Brazil
    Posts
    85
    Agradecido
    53
    Agradeceu
    37
    Peso da Avaliação
    4

    Padrão

    Você não usou as "rows" do bootstrap.
    Faz assim:

    <div class="row">
    Conteúdo do seu header.
    </div>
    <div class="row">
    Conteúdo do seu carousel.
    </div>

    Se mesmo assim continuar, coloque a propriedade overflow: hidden; na row.
    E retira a chamada do .map do bootstrap que não precisa dele e nem do bootstrap.css, só precisa chamar o bootstrap.min.css na verdade.
    E como o Little disse, deixa o seu .css por último.

  4. #4

    Avatar de [ADM]Lp
    Data de Ingresso
    Sep 2011
    Localização
    Magé
    Idade
    24
    Posts
    543
    Agradecido
    91
    Agradeceu
    63
    Peso da Avaliação
    12

    Padrão

    Citação Postado originalmente por Sudeikis Ver Post
    Você não usou as "rows" do bootstrap.
    Faz assim:

    <div class="row">
    Conteúdo do seu header.
    </div>
    <div class="row">
    Conteúdo do seu carousel.
    </div>

    Se mesmo assim continuar, coloque a propriedade overflow: hidden; na row.
    E retira a chamada do .map do bootstrap que não precisa dele e nem do bootstrap.css, só precisa chamar o bootstrap.min.css na verdade.
    E como o Little disse, deixa o seu .css por último.
    Não é ao contrário, precisa do bootstrap.css e não do min.css? Aqui removendo o bootstrap.css descontrola todo o layout, mais removendo o min.css fica normal.

  5. #5


    Avatar de Litlle
    Data de Ingresso
    Jul 2010
    Localização
    Bh
    Idade
    26
    Posts
    255
    Agradecido
    231
    Agradeceu
    78
    Peso da Avaliação
    12

    Padrão

    min é só um formato que tira linhas e espaços desnecessários, assim o código fica mais leve para carregamento, ou seja, o código é igual.

  6. #6

    Avatar de [ADM]Lp
    Data de Ingresso
    Sep 2011
    Localização
    Magé
    Idade
    24
    Posts
    543
    Agradecido
    91
    Agradeceu
    63
    Peso da Avaliação
    12

    Padrão

    Citação Postado originalmente por Litlle Ver Post
    min é só um formato que tira linhas e espaços desnecessários, assim o código fica mais leve para carregamento, ou seja, o código é igual.
    Seria o reset do css no caso?

    Se for eu uso o Normalize.css para fazer isso.

  7. #7


    Avatar de Litlle
    Data de Ingresso
    Jul 2010
    Localização
    Bh
    Idade
    26
    Posts
    255
    Agradecido
    231
    Agradeceu
    78
    Peso da Avaliação
    12

    Padrão

    css normal:
    body {
    background:#000;
    }

    css minify (min):
    body{background:#000}


    Em produção não importa que o css fique indentado, importa mais que ele fique menor e mais rápido para carregamento...

    Ex, no portal que trabalho o css normal fica em 200kb, min fica 54kb... O código é igual...

  8. #8

    Avatar de SmoLL
    Data de Ingresso
    Jun 2013
    Localização
    Form1.Location
    Posts
    4
    Agradecido
    11
    Agradeceu
    6
    Peso da Avaliação
    0

    Padrão

    Eu estou fazendo um site em bootstrap, alias é meio complicado falar assim, por que a base do layout eu peguei pronta, e sai editando os que eu não queria.
    e estou construindo a parte do painel e o acesso ao conteúdo que é listado.
    E claro tbm estou tentando manter ele totalmente responsivo, porem certas coisas num devido tamanho não fica como eu queria.
    ai eu apelo pro jquery
    exemplo

    Código:
        $(window).resize(function () {
            var TamanhoWidth = $(window).width();
            $("#amendoim").setAttribute("width", TamanhoWidth);
        });

 

 

Informações de Tópico

Usuários Navegando neste Tópico

Há 1 usuários navegando neste tópico. (0 registrados e 1 visitantes)

Tópicos Similares

  1. |Download| Mu Web Layout - Com Bootstrap 3 - Responsive
    Por SpinXO no fórum HTML - Nova área
    Respostas: 6
    Último Post: 10-03-2016, 11:48 PM
  2. |Avaliação| Layout MuOnline | Bootstrap 3
    Por Matheus SC. no fórum Avaliações
    Respostas: 6
    Último Post: 01-06-2015, 09:43 AM
  3. |Download| Tema responsivo html / css and Bootstrap
    Por SpinXO no fórum HTML - Nova área
    Respostas: 0
    Último Post: 29-05-2015, 01:29 PM
  4. |Dúvida| Dúvida referente a Bootstrap
    Por SCOFIELD no fórum HTML - Nova área
    Respostas: 2
    Último Post: 13-08-2014, 02:20 PM
  5. |Tutorial| BOOTSTRAP CSS (ÓTIMO CONTEÚDO)
    Por s00x no fórum Tutoriais
    Respostas: 4
    Último Post: 03-02-2014, 06:04 PM

Marcadores

Permissões de Postagem

  • Você não pode iniciar novos tópicos
  • Você não pode enviar respostas
  • Você não pode enviar anexos
  • Você não pode editar suas mensagens
  •