Ir para conteúdo

Pesquisar na Comunidade

Mostrando resultados para as tags ''bootstrap''.

  • Pesquisar por Tags

    Digite tags separadas por vírgulas
  • Pesquisar por Autor

Tipo de Conteúdo


Todas as áreas do Fórum

  • Q&A Desenvolvimento
    • Perguntas e respostas rápidas
  • Desenvolvimento e Banco de Dados
    • HTML e CSS
    • Java
    • Javascript
    • .NET
    • PHP
    • Python
    • Ruby
    • Mobile
    • Ambientes de Desenvolvimento
    • Arquitetura e Métodos Ágeis
    • Banco de Dados
    • DevOps
    • Desenvolvimento de Games
    • E-Commerce e Pagamentos Online
    • SEO e Otimizações
    • WordPress
    • Algoritmos & Outras Tecnologias
  • Design e Produto
    • Fotografia
    • Photoshop
    • Design de interfaces e UX
    • Edição/Produção de Vídeos
    • Marketing Online
    • Desenho, Ilustração e 3D
  • Entretenimento e uso pessoal
    • Geral
    • Segurança & Malwares
    • Gadgets e wearable
    • Softwares e Apps
    • Entretenimento

Encontrar resultados em...

Encontrar resultados que...


Data de Criação

  • Início

    FIM


Data de Atualização

  • Início

    FIM


Filtrar pelo número de...

Data de Registro

  • Início

    FIM


Grupo


Google+


Hangouts


Skype


Twitter


deviantART


Github


Flickr


LinkedIn


Pinterest


Facebook


Site Pessoal


Localização


Interesses

Encontrado 175 registros

  1. Sabrina Bruno

    Desenvolvimento Bootstrap

    Olá amigos do imasters, sou novo por aqui então se eu postei em uma área errada desculpem. Sou Front-end mas tem pouco tempo que comecei a mexer com Bootstrap, queria uma avaliação para ver o que vocês acham Link: http://brunohenrique.esy.es/movie/ esse é um dos meus primeiros projetos, criticas construtivas serão bem-vindas PS: não está 100% responsivo.
  2. Estou estudando o framework mencionado e tenho dificuldade de encontrar conteúdos que ensinem como usá-lo de forma customizada e consistente. Nesse sentido, cheguei a ler alguns livros, mas eles sempre abordam o assunto de forma rasa. Ainda assim, consegui aprender alguns princípios, como importar somente os partials necessários. No entanto, nem sempre eu uso todo código de um partial. Assim, sempre acaba sendo importado algum trecho desnecessário. Devido a isso, me pego questionando se isso é normal ou, mesmo, se estou usando todo o poder do Sass. Dado isso gostaria do esclarecimento de vocês, quanto ao seguinte: É comum "sobrar" CSS, importando um partial Bootstrap? Se sim: Então, devo usar alguma ferramenta como o UnCSS? Se não: O que posso estar fazendo errado? Conhecem algum conteúdo voltado a ensinar de forma ampla, como usar Bootstrap e seus partials?
  3. ment0r

    Mudar cor div navegação bootstrap

    Bom dia amigos. Estou desenvolvendo um site para um cliente e estou fazendo uso do bootstrap para tal. Utilizo a versão 3.3.7 (e gostaria de mantê-la). Bom, o problema é que não consigo mudar a cor dessa div. O trecho abaixo é da div <nav> <nav class="navbar navbar-default navbar fixed-top navbar-height navbar-zindex"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle glyphicon glyphicon-menu-hamburger" data-toggle="collapse" data-target="#bona-navbar"></button> <a class="navbar-brand" href="index.php"><img class="navbar-brand-" src="image/logo.jpg" alt="" /></a> </div> <ul id="bona-navbar" class="nav navbar-nav navbar-right collapse navbar-collapse navbar-zindex" data-toggle="collapse" data-target="#bona-navbar"> <li><a class="navbar-link" href="empresa.php">Empresa</a></li> <li><a class="navbar-link" href="servicos.php">Serviços</a></li> <li><a class="navbar-link" href="links.php">Links Úteis</a></li> <li><a class="navbar-link" href="orcamento.php">Orçamento</a></li> <li><a class="navbar-link" href="contato.php">Contato</a></li> <li><a class="navbar-link" href="localizacao.php">Localização</a></li> </ul> </div> </nav> Agora o css: .navbar-brand-{ height: 80px; } .navbar-height{ height: 110px; } .navbar-zindex{ z-index: 99; background: #f8f8f8; } .navbar-link{ font-family: 'Poppins', sans-serif; font-size: 18px; margin-top: 45px; } .navbar-link:hover{ font-size: 18px; background: #007cc2; } li:hover{ background: #e57716; height: 10px } E por fim, como fica no site: Gostaria de saber se alguém consegue me ajudar nessa? Ah, tbm não consigo mudar a cor dos links quando passo o mouse; do jeito que está não é como eu quero. Qualquer ajuda é bem vinda amigos. Obrigado a todos desde já, um grande abraço e até mais. Att.
  4. AlexV

    Problema com posicionamento de DIV's

    gostaria de posicionar a divs, igual está na imagem, estou usando html, css e bootstrap. oq eu quero fazer é colocar um video(o bloco maior) e video menores(blocos menores).
  5. Não estou conseguindo adicionar o usuario ou senha incorretos no formulário. Não aparece. Codigo html <!doctype html> <html lang="pt-br"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="description" content="Pagina de login "> <meta name="author" content="RXCad"> <link rel="icon" href="images/favicon.ico"> <title>RXCad - Login</title> <!-- AREA DE BOOTSTRAP --> <link href="css/bootstrap.min.css" rel="stylesheet"> <!--AREA DE CSS --> <link href="css/style.css" rel="stylesheet"> </head> <body class="text-center"> <!-- Fim container --> <form class="form-signin" method="POST" action="valida_login.php"> <img class="mb-4" src="https://getbootstrap.com/assets/brand/bootstrap-solid.svg" alt="" width="72" height="72"> <h1 class="h3 mb-3 font-weight-normal">Área restrita</h1> <!-- CAMPO DE USUARIO--> <label for="inputEmail" class="sr-only">Usuario</label> <input type="text" id="inputEmail" name="usuario" class="form-control" placeholder="Digite seu usuário" required autofocus> <!-- CAMPO DE SENHA--> <label for="inputPassword" class="sr-only">Senha</label> <input type="password" id="inputPassword" name="senha" class="form-control" placeholder="Digite sua senha" required> <!-- CAMPO DE LEMBRAR - ME--> <div class="checkbox mb-3"> <label> <input type="checkbox" value="remember-me"> Lembrar-me </label> <!--USUARIO OU SENHA INCORRETOS --> <p class="text-center text-danger"> <?php if(isset($_SESSION['loginErro'])){ echo $_SESSION['loginErro']; unset($_SESSION['loginErro']); } ?> </p> </div> <!-- BOTAO DE LOGIN--> <button class="btn btn-lg btn-primary btn-block" type="submit">Acessar</button> <p class="mt-5 mb-3 text-muted">© 2018-2029</p> </form><!-- Fim container--> </body> </html> PHP PARA VALIDAÇÃO DE DADOS <?php session_start(); $usuariot = $_POST['usuario']; //capta o usuario $senhat = $_POST['senha']; // capta senha //echo $usuariot." - ".$senhat; include_once("conexao.php"); $result = mysqli_query($conectar,"SELECT * FROM usuarios WHERE login = '$usuariot' AND senha = '$senhat' LIMIT 1" ); $resultado = mysqli_fetch_assoc($result); // echo $resultado['nome']; // tras o nome do usuario if(empty($resultado)){ //Mensagem de Erro $_SESSION['loginErro'] = "Usuário ou senha Inválido";// variavel global //Manda o usuario para a tela de login header("Location: login.php"); } ?> PHP DE CONEXÃO <?php $conectar = mysqli_connect("localhost","root","","rxcad") or die ("Erro de conexão"); mysqli_select_db($conectar,"rxcad") or die ("Base de dados não encontrada"); ?>
  6. Marcos Olynyk

    BOOTSTRAP - Estilizar range.

    Boa tarde galera. Alguém sabe me dizer como faço para o input range aparecer como a imagem? Preciso criar uma busca com intervalos de valores, gostaria de utilizar essa barra. Já procurei varios materiais na internet e não encontrei nada. Lembrando que estou utilizando Bootstrap.
  7. ndias

    Validator Bootstrap não funciona!

    <!DOCTYPE html> <head> <meta charset="utf-8"> <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"> </head> <body> <form name="form" action="" method="post" data-toggle="validator" role="form"> <div class="row"> <div class="help-block with-errors"></div> <div class="col-lg-4 col-md-4 col-sm-12 col-xs-12"> <input type="text" placeholder="CPF" name="CPF" data-error="Por favor, informe seu CPF." required> </div> <input type="submit" value="Cadastrar" /> </div> </form> <!--jQuery--> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <!--Bootstrap--> <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> <!--validator--> <script src="js/validator.min.js"></script> </body> </html>
  8. Eu precisava de implementar um link para o possível cliente entrar diretamente no meu whatsapp. Eu queria colocar uma imagem "fixa", quando o cliente rolar a barra de rolagem a imagem continua aparecendo no monitor, no canto inferior direito mas eu gostaria que esta imagem fosse responsiva usando o bootstrap.
  9. <!DOCTYPE html> <html lang="pt-br"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="description" content="curso de bootstrap 3"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"> <title>3° site com bootstrap tabelas</title> <style> .table-striped > tbody > tr{ background-color:red; } .table-hover > tbody >tr:hover{ background-color:blue; color:white; } </style> </head> <body> <div class="container-fluid"> <h3 class="text-center">Tabelas</h3> </div> <div class="row"> <div class="col-md-6"> <table class="table table-striped table-condensed table-hover table-bordered"> <thead> <tr > <th>Protocolo</th> <th>Razão Social</th> <th>CNPJ</th> </tr> </thead> <tbody> <tr> <td>0001</td> <td>Bootstrap essencial - ME</td> <td>00.000.000/0001-00</td> </tr> <tr > <td>0002</td> <td>Bootstrap essencial - ME</td> <td>00.000.000/0002-00</td> </tr> <tr> <td>0003</td> <td>Bootstrap essencial - ME</td> <td>00.000.000/0003-00</td> </tr> <tr> <td>0004</td> <td>Bootstrap essencial - ME</td> <td>00.000.000/0004-00</td> </tr> </tbody> </table> </div> <div class="col-md-6"> <div class="table-responsive"> <table class="table"> <thead> <tr> <th>Protocolo</th> <th>Razão Social</th> <th>CNPJ</th> </tr> </thead> <tbody> <tr> <td class="success">0001</td> <!--linhas decoradas--> <td class="danger">Bootstrap essencial - ME</td> <td class="warning">00.000.000/0001-00</td> </tr> <tr class="success"> <td>0002</td> <td>Bootstrap essencial - ME</td> <td>00.000.000/0002-00</td> </tr> <tr class="warning"> <td>0003</td> <td>Bootstrap essencial - ME</td> <td>00.000.000/0003-00</td> </tr> <tr class="active"> <td>0005</td> <td>Bootstrap essencial - ME</td> <td>00.000.000/0005-00</td> </tr> <tr class="info"> <td>0004</td> <td>Bootstrap essencial - ME</td> <td>00.000.000/0004-00</td> </tr> </table> </div> <!--tabela responsiva--> </div> </div> <script src="https://code.jquery.com/jquery-2.1.3.min.js"></script> <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> </body> </html> acima site usando a versão antiga <!DOCTYPE html> <html lang="pt-br"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="description" content="curso de bootstrap 3"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous"> <title>3° site com bootstrap tabelas</title> <style> .table-striped > tbody > tr{ background-color:red; } .table-hover > tbody >tr:hover{ background-color:blue; color:white; } </style> </head> <body> <div class="container-fluid"> <h3 class="text-center">Tabelas</h3> </div> <div class="row"> <div class="col-md-6"> <table class="table table-striped table-condensed table-hover table-bordered"> <thead> <tr > <th>Protocolo</th> <th>Razão Social</th> <th>CNPJ</th> </tr> </thead> <tbody> <tr> <td>0001</td> <td>Bootstrap essencial - ME</td> <td>00.000.000/0001-00</td> </tr> <tr > <td>0002</td> <td>Bootstrap essencial - ME</td> <td>00.000.000/0002-00</td> </tr> <tr> <td>0003</td> <td>Bootstrap essencial - ME</td> <td>00.000.000/0003-00</td> </tr> <tr> <td>0004</td> <td>Bootstrap essencial - ME</td> <td>00.000.000/0004-00</td> </tr> </tbody> </table> </div> <div class="col-md-6"> <div class="table-responsive"> <table class="table"> <thead> <tr> <th>Protocolo</th> <th>Razão Social</th> <th>CNPJ</th> </tr> </thead> <tbody> <tr> <td class="success">0001</td> <!--linhas decoradas--> <td class="danger">Bootstrap essencial - ME</td> <td class="warning">00.000.000/0001-00</td> </tr> <tr class="success"> <td>0002</td> <td>Bootstrap essencial - ME</td> <td>00.000.000/0002-00</td> </tr> <tr class="warning"> <td>0003</td> <td>Bootstrap essencial - ME</td> <td>00.000.000/0003-00</td> </tr> <tr class="active"> <td>0005</td> <td>Bootstrap essencial - ME</td> <td>00.000.000/0005-00</td> </tr> <tr class="info"> <td>0004</td> <td>Bootstrap essencial - ME</td> <td>00.000.000/0004-00</td> </tr> </table> </div> <!--tabela responsiva--> </div> </div> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js" integrity="sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js" integrity="sha384-uefMccjFJAIv6A+rW+L4AHf99KvxDjWSu1z9VI8SKNVmz4sk7buKt/6v9KI65qnm" crossorigin="anonymous"></script> </body> </html> o que denunciou a falha do framework foi a table-striped não ter funcionado e o estados nas linhas da tabela.
  10. Vicente Paulo Maciel

    Como fica o arquivo cabeçalho do BootStrap 4 ?

    <head> <meta charset="utf-8"> <title>Currículo</title> <meta http-equiv="Content-Language" content="pt-br"> <meta charset="utf-8"> <meta name="author" content="Vicente Paulo Maciel"> <meta name="description" content="Site de recrutamento on-line, divulgar vagas de emprego e cadastro de currículos"> <meta name="keywords" content="emprego,vaga,trabalho,currículo,rh,recursos humanos,curriculum vitae,cadastro de currículo"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0'/> <script src="<?= base_url('assets/bootstrap/css/bootstrap-theme.min.css') ?>"></script> <script src="<?= base_url('assets/bootstrap/js/jquery.js') ?>"></script> <script src="<?= base_url('assets/bootstrap/js/bootstrap.js') ?>"></script> <script src="<?= base_url('assets/js/js.js') ?>"></script> <script src="<?= base_url('assets/js/javascript.js') ?>"></script> <link rel="stylesheet" href="<?= base_url('assets/bootstrap/css/bootstrap.css') ?>"> <link rel="stylesheet" href="<?= base_url('assets/css/estilo.css') ?>"> <link rel="icon" type="image/jpg" href="<?= base_url('assets/img/favicon.ico') ?>"> <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script> <![endif]--> </head> Este é um exemplo com BootStrap 3.Quero saber como fica com BootStrap 4.Com o aquivo do BootStrap 4 baixado no computador.
  11. manolegal

    Diminuir espaço vertical bootstrap

    Olá amigos Gostaria de diminuir o espaçamento entre linhas no bootstrap, porém não está funcionando. Tentei da seguinte forma: .form_cad form{ margin: 0!important; padding: 0!important;} .form_cad h3{ margin: 0!important; padding: 0!important;} .form_cad row { margin: 0!important; padding: 0!important;} .form_cad form-group{ margin: 0!important; padding: 0!important;} .form_cad input-group{ margin: 0!important; padding: 0!important;} .form_cad select{ text-align: left; margin: 0!important; padding: 0!important;} .form_cad label{ margin: 0!important; padding: 0!important;} .form_cad a{ margin: 0!important; padding: 0!important;} .form_cad button{ margin: 0!important; padding: 0!important;} Meu formulário: <div class="container-fluid"> div class="row-fluid"> <div class="col-md-10"> <h3 class="page-header">Meu Form</h3> <div class="row"> <form id="cadastro" class="form_cad" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>"> <div class="row"> <div class="form-group col-md-3 col-md-offset-2"> <label>Data Solicitação</label> <div class="form-group"> <div class='input-group date' id='cal'> <input class="form-control form_input_recebe_foco" type="text" id="data_solicitacao" name="data_solicitacao" required autofocus maxlength="10" value="" placeholder="(Obrigatório)"> <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span> </div> </div> </div> </div> <!-- /row --> <div class="row"> <div class="form-group col-md-3 col-md-offset-2"> <label for="qdade_horas">Quantidade Horas</label> <input class="form-control form_input_recebe_foco" type="text" id="qdade_horas_dec" name="qdade_horas" maxlength="5" required autocomplete="off" value=""> </div> </div> <!-- /row --> .......... O estilo css não está funcionando em relação a diminuir o espaçamento entre as linhas do formulário. O que preciso fazer?
  12. vazzoler

    Selectpicker

    Bom dia galera, tenho um selectpicker multiple que alimento dinamicamente. Utilizo ele em um filtro de pesquisa. Tudo está ok, porém, o único problema que estou tendo é que quando dou submit no formulário, ele não guarda os itens que selecionei, ficando sem nada selecionado. Alguém sabe me dizer como consigo alimentar este selectpicker com os dados que selecionei antes do submit?
  13. Boa madruga Pessoal; Seguinte, eu criei o menu bootstrap segue o código abaixo. Quando eu estou vendo o site pelo celular, o menu vira um HAMBURGUER. Só que eu quero quando clicar no HAMBURGUER ele vira um X. E quando eu clicar no link ele voltar para o HAMBURGUER. <style type="text/css"> .navbar-toggle { border: none; background: transparent !important; } .navbar-toggle:hover { background: transparent !important; } .navbar-toggle .icon-bar { width: 22px; transition: all 0.2s; } .navbar-toggle .top-bar { transform: rotate(45deg); transform-origin: 10% 10%; } .navbar-toggle .middle-bar { opacity: 0; } .navbar-toggle .bottom-bar { transform: rotate(-45deg); transform-origin: 10% 90%; } .navbar-toggle.collapsed .top-bar { transform: rotate(0); } .navbar-toggle.collapsed .middle-bar { opacity: 1; } .navbar-toggle.collapsed .bottom-bar { transform: rotate(0); } </style> <!--INICIO NAV BAR ONDE FICA OS DADOS DO MENU--> <nav class="navbar navbar-default navbar-fixed-top" style="border-bottom: 3px solid #ff330d;"> <!--INICIO DIV CONTAINER ONDE VAI TODAS AS INFORMAÇÕES--> <div class="container-fluid containertop" id="topoinicio"> <div class="navbar-header"> <!--INICIO CONFIGURAÇÃO MENU HAMBERGUER--> <button type="button" class="navbar-toggle menuHamburguer collapsed" data-toggle="collapse" data-target="#menu-navegacao"> <span class="icon-bar top-bar"></span> <span class="icon-bar middle-bar"></span> <span class="icon-bar bottom-bar"></span> </button> <!--FIM CONFIGURAÇÃO MENU HAMBERGUER--> <!--INICIO LOGO MARCA--> <!--<a class="navbar-brand" href="#page-top"> <span class="iden">Iden</span> <span class="techonology">Technology</span> </a>--> <ol class="nav"> <ol class="menu" style="border:none;"> <a href="#home"> <img src="img/ico.png" class="img-responsive img-rounded imgLogo"> </a> </ol> </ol> <!--FIM LOGO MARCA--> </div> <!--INICIO MENU LINK--> <div class="collapse navbar-collapse menu-navegacao" id="menu-navegacao"> <ul class="nav navbar-nav navbar-right"> <li class="menu"> <a href="#home">HOME</a> </li> <li class="menu"> <a href="">FRUTAS EXÓTICAS</a> </li> <li class="menu"> <a href="">FRUTAS FRESCAS</a> </li> <li class="dropdown menu"> <a class="dropdown-toggle" data-toggle="dropdown" href="#">EMBALADOS</a> <ul class="dropdown-menu"> <!--<div class="clearfix"></div>--> <div id="sazonalidade" class="sazonalidade" style="margin-left:18px;"> <div href="letraE" class="sim">J</div> <div class="sim">F</div> <div class="sim">M</div> <div class="sim"><a href="#letraB">B</a></div> <div class="sim">M</div> <div class="sim"><a href="#letraC">C</a></div> <div class="sim">J</div> <div class="sim"><a href="#letraA">A</a></div> <div class="sim">S</div> <div class="sim"><a href="#letraE">E</a></div> <div class="sim">N</div> <div class="sim"><a href="#letraD">D</a></div> </div> </ul> </li> <li class="dropdown menu"> <a class="dropdown-toggle" data-toggle="dropdown" href="#">FAMÍLIAS<span class="caret"></span></a> <ul class="dropdown-menu"> <li><a familia="5">Kiwis</a></li><br/> <li><a familia="1">Maçãs</a></li><br/> <li><a familia="2">Mangas</a></li><br/> <li><a familia="3">Melões</a></li><br/> <li><a familia="7">Pêras</a></li><br/> <li><a familia="4">Pimentões</a></li><br/> <li><a familia="8">Uvas</a></li><br/> </ul> </li> <!--<li class="menu"> <a href="#localizacao">LOCALIZAÇÃO</a> </li> --> <li class="menu"> <a href="#contato">CONTATO</a> </li> </ul> </div> <!--FIM MENU LINK--> </div> <!--FIM DIV CONTAINER ONDE VAI TODAS AS INFORMAÇÕES--> </nav> <!--FIM NAV BAR ONDE FICA OS DADOS DO MENU--> Nesse outro artigo, foi so colocar a classe collapsed no buttom e deu certo. Mas nesse aqui não deu certo. O que poderia ser? Segue o link Erro Menu Hamburguer
  14. Tenho um código que adaptei daqui mesmo do fórum para adicionar campos dinâmicos. Meu problema é que ao adicionar um campo "select" que usa o "selectpicker bootstrap" ele não funciona. Não sei se é um problema de javascript ou de css então me desculpem se postei no local errado. Segue o código: //<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.1.min.js"></script> function mais_vinculos(){ var quantidade = $('.vinculo').size(); var div_qnt = parseInt(quantidade)+1; $('.mostrando_vinculos').append('<div class="form-group vinculo vinc'+div_qnt+'">\ <label class="col-md-9 control-label"><h4>Vinculo '+div_qnt+'</h4>\ <div class="form-group">\ <select name="vinculo[]" class="form-control selectpicker" data-live-search="true" title="Selecione vinculo...">\ <option value="1">Vinculo 1</option>\ <option value="2">Vinculo 2</option>\ <option value="3">Vinculo 3</option>\ <option value="4">Vinculo 4</option>\ <option value="5">Vinculo 5</option>\ </select>\ </div>\ <div class="form-group">\ <input name="nome[]" placeholder="Digite o nome..." class="form-control input-md" type="text"/>\ </div>\ </label>\ <div class="col-md-3">\ <a href="javascript: menos_vinculos(\'vinc'+div_qnt+'\')" class="btn btn-info pull-right">X</a>\ </div>\ </div><br/>\ '); } function menos_vinculos(classe){ $("."+classe).remove(); } <div class="mostrando_vinculos col-md-12"> </div> <div class="col-md-12"> <a href="javascript: mais_vinculos();" style="width:100%;" class="btn btn-md btn-default"> Adicionar vinculos </a> </div> O campo "input" aparece normal porém o select não é mostrado A classe fica assim: select.bs-select-hidden, select.selectpicker { display: none !important; } Mas se eu mudar ela o selectpicker bootstrap não funciona e aparece um select normal. O que eu posso fazer para resolver isso? Preciso usar o selectpicker bootstrap pois irão ter muitos resultados e a busca do selectpicker bootstrap facilita para meu caso. *Caso seja um CSS ou PHP e não javascript favor mover o tópico. Grato.
  15. Carlos Amendola

    ajuda bootstrap css

    Olá pessoal boa tarde estou corrigindo algumas falhas no site http://dev.maples.com.br/sardenberg/. logo no inicio do site , temos a apresentação de 3 posts. Um que pega 8 colunas e outros 2 que pegam o tamanho de 4 colunas cada. os menores devem ficar um abaixo do outro e ao lado esquerdo do maior, de forma alinhada. por alguma razão esses dois estão como se estivessem na mesma row, só que preciso que um fique abaixo do outro e os dois alinhados ao lado do post maior. se eu fizer uma outra row entre eles este segundo não irá para baixo do bloco? preciso de uma orientação abraços
  16. Boa tarde à todos. Resolvi tirar minha defasagem em relação à criação de sites responsivo e resolvi estudar Bootstrap. Fiz um site de teste pra implementar as técnicas do BS e no inspetor do Firefox e do Chrome, o site se ajudar ao redimensionamento e ficou Ok, porém quando foi visualizá-lo no meu celular, o mesmo fica como sendo visto no PC. Redimensionando a tela nos inspetores, aparece aquele menu hambúrguer; os elementos, imagens e fontes mudam de tamanho e o alinhamento fica vertical; no celular não. Se alguém puder me ajudar, o link para o teste é http://dcginfo.com/develop/mhf/ Agradeço aos amigos desde já pela ajuda. Grande abraço.
  17. Gilberto Jr

    Menu Bootstrap

    Pessoal, boa noite; Seguinte, eu tenho esse site que estou quase finalizando pra entregar. Iden Technology Quando eu estou vendo o site responsivo dai o menu muda. Vira aquela hamburguer. E eu queria que quando eu clicasse no HAMBURGUER e abre o menu, quando clicar no menu, ele fechar o menu que foi aberto. Como eu resolveria essa questão? Att; Gilberto Jr
  18. Gilberto Jr

    Menu Bootstrap

    Pessoal, boa noite; Seguinte, eu tenho esse site que estou quase finalizando pra entregar. Iden Technology Quando eu estou vendo o site responsivo dai o menu muda. Vira aquela hamburguer. E eu queria que quando eu clicasse no HAMBURGUER e abre o menu, quando clicar no menu, ele fechar o menu que foi aberto. Como eu resolveria essa questão? Att; Gilberto Jr
  19. Luis Felipe Rebecca

    [Resolvido] ROUTE NOT DEFINED

    Bom dia, Estou tendo um problema com as rotas e não estou conseguindo entender esse problema, pois esse problema só acontece com algumas rotas e somente na rota com "/". Trecho do código na route-web: Route::prefix('cliente-fornecedor')->group(function () { Route::get('/', 'Mock\\ClienteFornecedorController@listar')->name('cliente-fornecedor'); Route::get('cadastrar', 'Mock\\ClienteFornecedorControllers@form')->name('cliente-fornecedor.cadastrar'); }); Controller: <?php namespace App\Http\Controllers\Mock; use Illuminate\Http\Request; use App\Http\Controllers\Controller; class ClienteFornecedorController extends Controller { public function form(Request $request) { return view('pages.cliente-fornecedor.form'); } public function listar(Request $request) { return view('pages.cliente-fornecedor.listar'); } } Problema: Alguém poderia me ajudar?
  20. Bom dia, Estou fazendo uma tabela em Bootstrap e quero que ela fique com a barra de rolagem horizontal;Certo!! Eu coloquei a barra de rolagem, porem a tabela não fica totalmente responsiva, alguns campos pular para a linha de baixo dentro do tr e eu queria que todos ficassem em somente uma linha.Segue imagem do problema relatado:Segue o código: <div class="table-responsive"> <table class="table table-sm table-striped table-bordered table-hover" style="width: 99.99%" > <thead> <tr> <th scope="col" style="text-align: center;">Identificação</th> <th scope="col" style="text-align: center;">Endereço</th> <th scope="col" style="text-align: center;">Bairro</th> <th scope="col" style="text-align: center;">Cidade</th> <th scope="col" style="text-align: center;">Estado</th> <th scope="col" style="text-align: center;">Cep</th> <th scope="col" style="text-align: center;">Cnpj/Cpf</th> <th scope="col" style="text-align: center;">Ins. Estadual</th> <th scope="col" style="text-align: center;">Restrições</th> <th scope="col" style="text-align: center;">Ações</th> </tr> </thead> <tbody> <tr> <td>Tecmaf</td> <td>Rua xxxxxxxxxxx,2024</td> <td>Residencial Nardini</td> <td>Americana</td> <td>SP</td> <td>154765488-25</td> <td>475214874545</td> <td>4144634627723</td> <td>08:00 ÀS 11:30 </td> <td class="text-nowrap" style="text-align: center"><a href="#" data-original-title="editar"> <i class="fa fa-pencil text-inverse m-r-10"></i> </a> <a href="#" data-original-title="editar"> <i class="fa fa-trash text-inverse m-r-10"></i> </a> </td> </tr> <tr> <td>Tecmaf</td> <td>Rua xxxxxxxxxxx,2024</td> <td>Residencial Nardini</td> <td>Americana</td> <td>SP</td> <td>154765488-25</td> <td>475214874545</td> <td>4144634627723</td> <td>08:00 ÀS 11:30</td> <td class="text-nowrap" style="text-align: center"><a href="#" data-original-title="editar"> <i class="fa fa-pencil text-inverse m-r-10"></i> </a> <a href="#" data-original-title="editar"> <i class="fa fa-trash text-inverse m-r-10"></i> </a> </td> </tr> <tr> <td>Tecmaf</td> <td>Rua xxxxxxxxxxx,2024</td> <td>Residencial Nardini</td> <td>Americana</td> <td>SP</td> <td>154765488-25</td> <td>475214874545</td> <td>4144634627723</td> <td>08:00 ÀS 11:30</td> <td class="text-nowrap" style="text-align: center"><a href="#" data-original-title="editar"> <i class="fa fa-pencil text-inverse m-r-10"></i> </a> <a href="#" data-original-title="editar"> <i class="fa fa-trash text-inverse m-r-10"></i> </a> </td> </tr> <tr> <td>Tecmaf</td> <td>Rua xxxxxxxxxxx,2024</td> <td>Residencial Nardini</td> <td>Americana</td> <td>SP</td> <td>154765488-25</td> <td>475214874545</td> <td>4144634627723</td> <td>08:00 ÀS 11:30 </td> <td class="text-nowrap" style="text-align: center"><a href="#" data-original-title="editar"> <i class="fa fa-pencil text-inverse m-r-10"></i> </a> <a href="#" data-original-title="editar"> <i class="fa fa-trash text-inverse m-r-10"></i> </a> </td> </tr> </tbody> </table> </div> Resumindo... preciso que ela fique totalmente em uma linha só e o usuário só consiga ver os dados se ele rolar a barra para a direita.
  21. Rodrigo Vieira E da Silva

    Slider horizontal e Hover com elementos

    Boa noite a todos, tudo bem com vocês? A minha dúvida é a seguinte, eu estou utilizando o Bootstrap 4 e o design, fez um layout do site utilizando um slider horizontal de fotos, e quando passa o mouse sobre a foto o hover dessa foto é diferente pois será adicionado mais informações eu gostaria de saber como eu consigo produzir isso. É somente isso. Obrigado a todos. Abraços.
  22. Richard Henrique

    Organograma em css

    Boa tarde, Alguem conhece bem de front end? porque estou começando. Meu organograma em css está quebrando, queria deixar ele continuo, sem quebrar, ja tentei colocar overflow-x: auto, e coisas do tipo, mas mesmo assim ele quebra conforme imagem. Estou usando dentro do container-fluid do bootstrap 4, alguem sabe como solucionar? Meu css: <style> /*#region Organizational Chart*/ .tree * { margin: auto; padding: 0px; } .tree ul { padding-top: 20px; position: relative; -transition: all 0.s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; } .tree li { float: left; text-align: center; list-style-type: none; position: relative; padding: 20px 5px 0 0px; -transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; } /*We will use ::before and ::after to draw the connectors*/ .tree li::before, .tree li::after{ content: ''; position: absolute; top: 0; right: 50%; border-top: 2px solid #696969; width: 50%; height: 20px; } .tree li::after{ right: auto; left: 50%; border-left: 2px solid #696969; } /*We need to remove left-right connectors from elements without any siblings*/ .tree li:only-child::after, .tree li:only-child::before { display: none; } /*Remove space from the top of single children*/ .tree li:only-child{ padding-top: 0;} /*Remove left connector from first child and right connector from last child*/ .tree li:first-child::before, .tree li:last-child::after{ border: 0 none; } /*Adding back the vertical connector to the last nodes*/ .tree li:last-child::before{ border-right: 2px solid #696969; border-radius: 0 5px 0 0; -webkit-border-radius: 0 5px 0 0; -moz-border-radius: 0 5px 0 0; } .tree li:first-child::after{ border-radius: 5px 0 0 0; -webkit-border-radius: 5px 0 0 0; -moz-border-radius: 5px 0 0 0; } /*Time to add downward connectors from parents*/ .tree ul ul::before{ content: ''; position: absolute; top: 0; left: 50%; border-left: 2px solid #696969; width: 0; height: 20px; } .tree li a{ height: auto; width: auto; padding: 5px 10px; text-decoration: none; background-color: white; color: #8b8b8b; font-family: arial, verdana, tahoma; font-size: 11px; display: inline-block; box-shadow: 0 1px 2px rgba(0,0,0,0.1); -transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; } /*Time for some hover effects*/ /*We will apply the hover effect the the lineage of the element also*/ .tree li a:hover, .tree li a:hover+ul li a { background: #cbcbcb; color: #000; } /*Connector styles on hover*/ .tree li a:hover+ul li::after, .tree li a:hover+ul li::before, .tree li a:hover+ul::before, .tree li a:hover+ul ul::before{ border-color: #94a0b4; } .center { margin: auto; width: 50%; padding: 80px; } /*#endregion*/ </style> Um trecho do meu html: <div class="tree"> <ul> <li style="padding: 20px 202px 10px 201px !important"> </a> <br> <br> <a href="#"> <div class="container-fluid"> <div class="flex-row"> <?php $status = 4; try { $listaSquad=new Organograma(); $listaSquad->status=$status; $resultado=$listaSquad->listarOrganograma($status); } catch ( Exception $e ) { Erro::trataErro( $e ); } ?> PRODUTO </div> <div class="row" style="margin-top: 35px;"> <i class="fa fa-exclamation-circle fa-2x"></i> </div> </div> </a> <ul> <li style="padding: 20px 202px 10px 201px !important"> <a href="#"> <div class="container-fluid"> <div class="flex-row"> DESENVOLVIMENTO </div> <div class="row" style="margin-top: 35px;"> <i class="fa fa-exclamation-circle fa-2x"></i> </div> <div class="row"> <?php $status = 15; try { $listaSquad=new Organograma(); $listaSquad->status=$status; $resultado=$listaSquad->listarSeresOrganograma($status); } catch ( Exception $e ) { Erro::trataErro( $e ); } ?> </div> </div> </a> </li> </ul> </li> </ul> </div> se alguem puder ajudar, agradeço. valeu
  23. Artur Mendonça

    Alinhar dropdown menu Bootstrap

    Olá amigos, estou desenvolvendo um site com bootstrap para uma associação sem fins lucrativos, mas não estou conseguindo alinhar o dropdown menu, pois quando clico em cima do botão as diversas opções aparecem mais à esquerda do botão; se encostar os outros botões a listagem fica alinhada mas não fica bem esteticamente. Junto uma imagem para melhor esclarecimento. A imagem da esquerda é como fica e a direita é como pretendo que fique mas com os botões separados. Muito obrigado-
  24. Clauido José

    menu lateral fixo

    Pessoal sou novo com bootstrap e gostaria de um exemplo de um menu com submenu lateral responsivel fixo eu quero eu menu fique fixo e conteúdo role somente para baixo
  25. MateusFreitas01

    Orientação Landscape com Bootstrap

    Poderiam me dizer se existe alguma forma de fazer a orientação em landscape utilizar as classes do padrão sm do Bootstrap ao invés de xs? Obrigado.
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.