Ir para conteúdo
Lisbi

Select option usando Dropkick desconfigurado no IE

Recommended Posts

Boa noite Pessoal

 

Estou com um problema sério, baixei um plugim para estilizar o meu select option de opções de cidades do meu projeto,

até ai td bem! Mas quando fui testar no IExplorer ele duplicava os selects, mostrando o estilizado e o select basico do html (sem estilização).

resolvi o problema da seguinte forma usando esses códigos css.

.formulario select {
	position: inherit;
	display: none;
}

E funcionou igual nos navegadores, mas quando fui ver o site "(responsivo)" pelo celular  tive a surpresa de não aparecer o select de opções, então vi que o display influenciava diretamente nisso!

Dai vem o meu dilema, se eu mudar o display, funciona em todos os navegadores normalmente e tb no celular, embora no celular seja sem estar estilizado!

 

Como resolvo esse problema, gostaria que funcionasse corretamente em todos! Alguem ai pode esclarecer pra mim como resolvo esse problema?

 

Desde já eu agradeço pessoal.  

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Boa tarde pessoa! @Fabio Victor, foi de grande ajuda esse tutorial! Mas mesmo aplicando as regras e mudando ate o layout do site, o select option continuou sem aparacer! Sera que tem como eu mudar esse codigo css acima só para as telas de celulares!

Tipo :

.formulario select {
	position: inherit;
	display: block;
}

 

mas para ter essa leitura só quando for acessado pelos smart fones

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora


  • Conteúdo Similar

    • Por Gustavo Brandão
      Olá, estou tentando resolver um problema no meu css:
       
      Atualmente:

       
      Como quero que fique:

       
      CSS:
      #categories { padding: 0; margin: -1px 0 0 0; display: flex !important; } #categories > ul:first-child { flex: 1; } #categories .nav.navbar-nav li { margin: 0; height: 100%; display: flex; border-top: 2.5px solid #FD8C07; border-bottom: 2.5px solid #FD8C07; } #categories .nav.navbar-nav li:hover { border-color: #FD7E07; } #categories .nav.navbar-nav li a { flex: 1; color: #fff; padding-left: 25px; padding-right: 25px; font-size: 16px; font-weight: bold; text-shadow: 1px 1px 5px #4E4E4E; } #categories .nav.navbar-nav li.active { border-top: 2.5px solid #FCCA00; border-bottom-color: #FD7E07; } #categories .nav.navbar-nav li.active::before { font-family: FontAwesome; content: "\f0d7"; position: absolute; z-index: 20; top: 0; left: 0; right: 0; height: 5px; line-height: 5px; font-size: 18px; text-align: center; color: #FCCA00; } #categories .nav.navbar-nav li.active a { color: #FCCA00; } #categories .nav.navbar-nav li.active a, #categories .nav.navbar-nav li a:hover, #categories .nav.navbar-nav li:active a, #categories .nav.navbar-nav li a:active { background-color: #FD7E07; } #categories .search { display: flex; } #categories .search input { flex: 1; border-radius: 0; border: none; color: #168FFF; } #categories .search button { flex: 1; border-radius: 0; color: #168FFF; background-color: #fff; border: none; }  
    • Por bernardorodel
      Fala pessoal, não consegui entender o porquê de não salvar e recorri ao fórum.
       
      To fazendo apenas um editar.php.
       
      editar.php:
      <?php require 'conexao.php'; $id_cliente = (isset($_GET['id'])) ? $_GET['id'] : ''; if (!empty($id_cliente) && is_numeric($id_cliente)): $conexao = conexao::getInstance(); $sql = 'SELECT nome, rg, sexo, telefone, cidade, endereco FROM visitantes WHERE id = :id'; $stm = $conexao->prepare($sql); $stm->bindValue(':id', $id_cliente); $stm->execute(); $cliente = $stm->fetch(PDO::FETCH_OBJ); if(!empty($cliente)): endif; endif; ?> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Controle de Visitantes</title> <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"> <link rel="stylesheet" type="text/css" href="css/custom.css"> <style type="text/css"> <!-- body { background-image: url("./img/bg.jpg"); background-repeat: no-repeat; background-attachment: fixed; background-position: center; background-size: cover; } <!----> </style> </head> <body> <div class='container'> <fieldset> <legend><h1>Edição de Visitante</h1></legend> <?php if(empty($cliente)):?> <h3 class="text-center text-danger">Visitante não encontrado!</h3> <?php else: ?> <form action="action_cliente.php" method="post" id='form-contato' enctype='multipart/form-data'> <div class="row"> <div class="form-group"> <label for="nome">Nome</label> <input type="text" class="form-control" id="nome" name="nome" value="<?=$cliente->nome?>" placeholder="Informe o Nome do Visitante"> <span class='msg-erro msg-nome'></span> </div> <div class="form-group"> <label for="rg">RG</label> <input type="rg" class="form-control" id="rg" name="rg" maxlength="11" value="<?=$cliente->rg?>" placeholder="Informe o RG do Visitante"> <span class='msg-erro msg-rg'></span> </div> <div class="form-group"> <label for="sexo">Gênero</label> <select class="form-control" name="sexo" id="sexo"> <option value="<?=$cliente->sexo?>"><?=$cliente->sexo?></option> <option value="masculino">Masculino</option> <option value="feminino">Feminino</option> </select> <div class="form-group"> <label for="telefone">Telefone</label> <input type="telefone" class="form-control" id="telefone" name="telefone" maxlength="11" value="<?=$cliente->telefone?>" placeholder="(00)000000000"> <span class='msg-erro msg-telefone'></span> </div> <div class="form-group"> <label for="estado">Estado</label> <select class="form-control" name="estado" id="estado"> <option value="<?=$cliente->estado?>"></option> <option value="PR">PR</option> <option value="RS">RS</option> <option value="SC">SC</option> </select> <span class='msg-erro msg-status'></span> </div> <div class="form-group"> <label for="cidade">Cidade</label> <input type="cidade" class="form-control" id="cidade" maxlength="30" name="cidade" value="<?=$cliente->cidade?>" placeholder="Informe a Cidade do Visitante"> <span class='msg-erro msg-cidade'></span> </div> <div class="form-group"> <label for="endereco">Endereço</label> <input type="endereco" class="form-control" id="endereco" maxlength="30" name="endereco" value="<?=$cliente->endereco?>" placeholder="Informe o Endereço do Visitante"> <span class='msg-erro msg-endereco'></span> </div> <input type="hidden" name="acao" value="editar"> <input type="hidden" name="id" value="<?=$cliente->id?>"> <button type="submit" class="btn btn-primary" id='botao'> Salvar </button> <a href='listarvisitantes.php' class="btn btn-danger">Cancelar</a> </form> <?php endif; ?> </fieldset> </div> </body> </html>  
      action_cliente.php:
       
      <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Sistema de Cadastro</title> <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"> <link rel="stylesheet" type="text/css" href="css/custom.css"> </head> <body> <div class='container box-mensagem-crud'> <?php require 'conexao.php'; $conexao = conexao::getInstance(); $acao = (isset($_POST['acao'])) ? $_POST['acao'] : ''; $id = (isset($_POST['id'])) ? $_POST['id'] : ''; $nome = (isset($_POST['nome'])) ? $_POST['nome'] : ''; $rg = (isset($_POST['rg'])) ? str_replace(array('.','-'), '', $_POST['rg']): ''; $sexo = (isset($_POST['sexo'])) ? $_POST['sexo'] : ''; $telefone = (isset($_POST['telefone'])) ? $_POST['telefone'] : ''; $estado = (isset($_POST['estado'])) ? $_POST['estado'] : ''; $cidade = (isset($_POST['cidade'])) ? $_POST['cidade'] : ''; $endereco = (isset($_POST['endereco'])) ? $_POST['endereco'] : ''; $mensagem = ''; if ($acao == 'editar' && $id == ''): $mensagem .= '<li>ID do registros desconhecido.</li>'; endif; $sql = 'UPDATE visitantes SET nome=:nome, rg=:rg, sexo=:sexo, telefone=:telefone, estado=:estado, cidade=:cidade, endereco=:endereco WHERE id =:id'; $stm = $conexao->prepare($sql); $stm->bindValue(':nome', $nome); $stm->bindValue(':rg', $rg); $stm->bindValue(':sexo', $sexo); $stm->bindValue(':telefone', $telefone); $stm->bindValue(':estado', $estado); $stm->bindValue(':cidade', $cidade); $stm->bindValue(':endereco', $endereco); $stm->bindValue(':id', $id); $retorno = $stm->execute(); if ($retorno): echo "<div class='alert alert-success' role='alert'>Registro editado com sucesso, aguarde você está sendo redirecionado ...</div> "; else: echo "<div class='alert alert-danger' role='alert'>Erro ao editar registro!</div> "; endif; echo "<meta http-equiv=refresh content='3;URL=listarvisitantes.php'>"; ?> </div> </body> </html> O erro é que não tem erro. Mostra que registrou porém não salva a alteração e eu não sei qual é o causador disso.
       

       
      Obrigado desde já!
    • Por MateusFreitas01
      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.
    • Por uninerds
      Olá pessoal, estamos criando algumas vídeo aulas de programação em HTML5 e CSS e gostaríamos que vocês dessem críticas e sugestões do que podemos estar fazendo para melhorar
      Segue o link da playlist com 19 vídeos de HTML5
      https://www.youtube.com/playlist?list=PLi3qhjm7dbeeC5h0NDfUiRqEvE0v08Pdd
       
      1 - O que é HTML, CSS e JavaScript?
      É explicado o que é HTML, CSS e JavaScript e porque é necessário conhecer estas 3 linguagens para programar para Web
       
      2 - Programas Necessários
      É mostrado os programas necessários para começar a programar (estamos fazendo as vídeo aulas no sistema operacional Xubuntu)
       
      3 - Primeiro HTML5
      Começamos a mostrar de fato como começar a programar em HTML e como fazer para validar o código
       
      4 - Hierarquia de títulos e linha horizontal
      Como fazer hierarquia de títulos e colocar linha horizontal
      Tags: h1 até h6 e hr
       
      5 - Parágrafo, quebra de linha e texto pré-formatado
      Como fazer parágrafo, quebra de linha e texto pré-formatado
      Tags: p, br e pre
       
      6 - Formatação de texto
      Como fazer formatação de texto
      Tags: b, strong, i, em, mark, small, sub, sup, ins e del
      Atributos: cite e datetime das tags ins e del
       
      7 - Citações
      Como fazer citações
      Tags: q, blockquote, cite, address, abbr e bdo
      Atributos: title da tag abbr, dir da tag bdo e cite das tags q e blockquote
       
      8 - Comentários e comentários condicionais
      Como fazer comentário e para que serve
       
      9 - Arquivo Externo
      Como fazer referência de arquivo externo no HTML
       
      10 - Links | Parte 1
      Como fazer links para abrir outros HTML, enviar e-mail, executar JavaScript e direcionar para um local específico
      Tag: a
      Atributos: href, hreflang e type
       
      11 - Links | Parte 2
      Como criar links para download, diferentes formas de abrir no navegador e vulnerabilidade do target="_blank"
      Tag: a
      Atributos: download e target
      Valores para o target: _self, _blank, _top e _parent
       
      12 - Links | Parte 3
      Como resolver vulnerabilidade do target="_blank" e o atributo rel
      Tag: a
      Atributo: rel
      Valores para o rel: alternate, author, bookmark, prev, next, external, help, license, search, tag, nofollow, noreferrer, noopener
       
      13 - Bloco e Linha
      O conceito de tag de bloco e de linha
      Tags: div e span
       
      14 - Imagem | Parte 1
      Como colocar imagem no HTML
      Tag: img
      Atributos: src, alt, width, height, crossorigin, ismap e longdesc
      Valores para o crossorigin: anonymous e use-credentials
       
      15 - Imagem | Parte 2
      Como fazer mapeamento de imagem para colocar link dentro dela
      Tags: img, map e area
      Atributo da img: usemap
      Atributo da map: name
      Atributos da area: shape, coords e alt
      Valores para o shape: circle, rect e poly
       
      16 - Imagem | Parte 3
      Como definir imagens diferentes para dispositivos com características de tela diferentes
      Tags: img, picture e source
      Atributos da img: srcset e sizes
      Atributos da source: srcset, sizes, media e type
       
      17 - Tabela | Parte 1
      Como criar tabela em HTML
      Tags: table, caption, tr, th e td
      Atributos da th: abbr, sorted e scope
      Atributos da th e da td: colspan, rowspan e headers
      Valores para o scope: col, colgroup, row e rowgroup
       
      18 - Tabela | Parte 2
      Como altarar estilo de uma coluna inteira e definir cabeçalho, corpo e rodapé da tabela
      Tags: colgroup, col, thead, tbody e tfoot
      Atributo da colgroup e col: span
       
      19 - Lista
      Como criar lista não-ordenada, ordenada e de descrição
      Tags: ul, li, ol, dl, dt e dd
      Atributos da ol: type, reversed e start
      Atributos da li quando estiver na ol: value
      Valores para o type: 1, a, A, i e I
       
      Segue o link da playlist com 9 vídeos de CSS
      https://www.youtube.com/playlist?list=PLi3qhjm7dbedkcSwqOrGYHD_E_0H7Nopj
       
      1 - O que é HTML, CSS e JavaScript?
      É explicado o que é HTML, CSS e JavaScript e porque é necessário conhecer estas 3 linguagens para programar para Web
       
      2 - Programas Necessários
      É mostrado os programas necessários para começar a programar (estamos fazendo as vídeo aulas no sistema operacional Xubuntu)
       
      3 - Primeiro CSS
      Como fazer a integração entre HTML e CSS
       
      4 - Cores
      Como definir cor por nome, hexadecimal, RGB, HSL, RGBA e HSLA
       
      5 - Initial e Inherit
      Como utilizar os valores initial e inherit para propriedades em CSS
       
      6 - Media Query
      Como definir estilos diferentes para tipos de dispositivos diferentes e mesmo tipo de dispositivo com características diferentes
       
      7 - Borda | Parte 1
      Como fazer bordas em CSS
      Propriedades: border, border-color, border-radius, border-style e border-width
      Valor para border-color: transparent
      Valores para border-style: none, hidden, dotted, dashed, solid, double, groove, ridge, inset e outset
      Valores para border-width: medium, thin e thick
       
      8 - Borda | Parte 2
      Como alterar as propriedades da borda em cada lado
      Propriedades: border-bottom, border-bottom-color, border-bottom-style, border-bottom-width, border-left, border-left-color, border-left-style, border-left-width, border-top-left-radius, border-top-right-radius, border-bottom-right-radius, border-bottom-left-radius, border-right, border-right-color, border-right-style, border-right-width, border-top, border-top-color, border-top-style e border-top-width
       
      9 - Largura e Altura
      Como definir largura e altura em CSS e também valor mínimo e máximo para cada uma
      Propriedades: width, height, min-width, max-width, min-height e max-height
       
      PS:
      - Como temos nossos serviços seculares que é como conseguimos o sustento não teremos como responder todos os comentários de imediato, mas de qualquer forma agradecemos desde já a ajuda
      - Sempre que tiver vídeo novo atualizaremos este tópico
×

Informação importante

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

Este projeto é mantido e patrocinado pelas empresas:
Hospedado por: