Jump to content
frlopes

Ajuda para linhar um botão e um título numa tela de login em asp.net com bootstrap

Recommended Posts

Boa tarde, pessoal... 

 

Tenho o código abaixo e gostaria de saber como faço para alinhar o botão e o título "Login do Sistema" da mesma forma que estão alinhados os inputs...

Tentei colocar style="align-items:center" em tudo, rsrsrs e não alinhou.

Se alguém puder me ajudar, agradeço.

 

<div class="container">
        <div class="form-login">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <div class="panel-title">Login do Sistema</div>
                </div>
                    <div style="padding-top:30px" class="panel-body">
                        <div style="display:none" id="result" class="alert alert-danger col-sm-12"></div>

                    <div style="margin-bottom: 25px" class="input-group">
                        <span class="input-group-addon">
                            <i class="glyphicon glyphicon-user"></i>
                        </span>
                        @Html.EditorFor(model => model.EMAIL, new { htmlAttributes =
                        new { @class = "form-control input-lg", placeholder =
                        "E-mail", autofocus = true } })
                        @Html.ValidationMessageFor(model => model.EMAIL, "",
                        new { @class = "text-danger" })
                    </div>

                    <div style="margin-bottom: 25px" class="input-group">
                        <span class="input-group-addon">
                            <i class="glyphicon glyphicon-lock"></i>
                        </span>
                        @Html.EditorFor(model => model.SENHA, new { htmlAttributes
                        = new { @class = "form-control input-lg", placeholder = "Senha" } })
                        @Html.ValidationMessageFor(model => model.SENHA, "",
                        new { @class = "text-danger" })
                    </div>

                    <div style="margin-top:10px; align-items:center" class="form-group">
                        <div class="col-sm-12 controls" style="align-items:center">
                            <input type="submit" value="Acessar" style="align-items:center" class="btn primary btn-lg" />
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

 

Resultado abaixo:

 

image.png.5900badd01b90d311db833758edb8fd6.png

 

 

 

 

 

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By sander147
      Boa Tarde, estou com um problema ao por o menu ao lado direito, ele não fica alinhado com o campo de notícias, eu não faço ideia de como fazer eles ficarem lado a lado, alguém poderia me dar uma luz? eu estou seguindo um livro da casa do código mas os resultados não saíram iguais depois que eu fui além do livro. :/
      Deveria ficar assim:
       https://uploaddeimagens.com.br/images/002/561/267/original/menu.png?1585683825
       
      Ficou assim:

    • By vcapelli
      Eu sei o que eu vou pedir é meio loucura mas espero que ao menos seja possível. É o seguinte: eu quero fixar um valor X e sempre depois das 18 horas esse valor atualizasse aumentando ou diminuindo de acordo com a bolsa de valores. Exemplo:
      Orçamento 100bi, hoje a bolsa fechou em queda de 2,73% então ela atualizaria para 97,27bi.
      Eu sei que é loucura mas se for possível realizar agradeceria imensamente, não precisam ter pressa também
    • By SaraAlcaras
      Olá galera! Estou criando um jogo da velha para coloca no meu portfólio, porem estou com um pequeno problema que não consigo resolver.. Quando o jogo finaliza a tela da uma ampliada/expandida no tamanho é quase imperceptível porem é algo que eu gostaria de mudar. Qual propriedade posso usar no css pra evitar que isso aconteça?
       
      Código CSS:

       
      :root{ --O-color: rgb(10, 177, 243); --X-color: rgb(253, 148, 148); --E-color: rgb(0, 0, 0); } * { margin: 0; padding:0; box-sizing: border-box; } body { display: grid; align-items: center; justify-content: center; font-family: grenze; height: 100vh; background-color: rgb(153, 153, 153); } .nextPlayer{ color: rgb(60, 62, 63); border: 1px solid rgb(211, 223, 104); box-shadow: 3px 5px 12px rgb(0, 0, 0); } .players { color: rgb(60, 62, 63); border: 1px solid rgb(211, 223, 104); box-shadow: 3px 5px 12px rgb(0, 0, 0); height: 55px; display: flex; flex-direction: column; justify-content: space-evenly; } .player{ display: flex; } .topo { display: flex; flex-direction: row; align-items: center; justify-content: space-evenly; margin-bottom: 20px; } .topo .players, .topo .nextPlayer { font-family: grenze; font-weight: bold; border-radius: 4px; } .title { font-size: 3rem; color: rgb(60, 62, 63); margin-bottom: 0; } .title2 { display: none; } .board { display: grid; grid-template-columns: repeat(3, 178px); grid-template-rows: repeat(3, 130px); gap: 1rem; cursor: pointer; } .board.game-over{ opacity: 0.10; } .cell { display: grid; align-items: center; justify-content: center; background-color: white; border-radius: 4px; font-size: 2rem; font-weight: bold; color: #00000066; } .cell:not(.O):not(.X):hover { box-sizing: 0 20px 25px -5px rgba(0, 0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0, 0.4); } .cell.O, .cell.X, .game-over .cell { cursor: not-allowed; } .cell.O { background-color: var(--O-color); } .cell.X { background-color: var(--X-color); } footer{ text-align: center; font-size: 30px; } .winner-message{ margin: 1rem; } .winner-message span.O{ color: var(--O-color); } .winner-message span.X{ color: var(--X-color); } .winner-message span.E{ color: var(--E-color); } button { padding: 0.9rem 1.5rem; border: none; border-radius: 5px; box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0, 0.6); background-color: rgb(68, 255, 146); color: white; font-size: 1.2rem; cursor: pointer; } @media only screen and (max-width: 767px) and (orientation:portrait) { body { width: 100%; text-align: justify; } .board{ grid-template-columns: repeat(3, 88px); grid-template-rows: repeat(3, 80px); -webkit-tap-highlight-color: transparent; } button { font-size: 10px; } .cell { border-radius: 3px; font-size: 1rem; } footer { font-size: 13px; } .title { font-size: 1.5rem; display: none; padding: 0.6em; /* transform: translateY(80%); */ } .title2 { display: flex; font-size: 1.5rem; padding: 0.6em; color: rgb(60, 62, 63); } .topo{ flex-direction: column; } .players { height: 65px; width: 95px; align-items: center; } .nextPlayer{ text-align: center; height: 22px; width: 118px; /* transform: translateY(-150%); */ } } @media only screen and (max-width: 767px) and (orientation:landscape) { body { width: 100%; text-align: justify; } .board { grid-template-columns: repeat(3, 60px); grid-template-rows: repeat(3, 60px); -webkit-tap-highlight-color: transparent; } footer { font-size: 0.5rem; display: flex; flex-direction: row; align-items: center; justify-content: space-evenly; } button { font-size: 0.5rem; } .title { font-size: 0.8rem; } .players{ height: 30px; width: 50px; align-items: center; font-size: 0.5rem; } .nextPlayer{ text-align: center; height: 14px; width: 60px; font-size: 0.5rem; } .cell { border-radius: 3px; font-size: 0.8rem; } } @media only screen and (min-width: 991px) and (max-width: 1200px) { body { width: 100%; text-align: justify; } }

    • By adriano.eurich
      Tem como recuperar os dados do banco que foram incluídos através do create, e retornar para a mesmo formulário?
      Quando eu inserir o numero da chave e clicar em pesquisar ele traz o resultado do banco referente aquela chave se ela estiver com a situação 1 que é emprestado ai habilitaria os botões editar e deletar, onde o deletar apenas alterava o situação de 1 para 2 .
      Não consigo fazer essa parte de busca no banco e retornar no mesmo formulário, se é que é possível!
       
      cadastro.php
       
      <?php session_start(); include_once 'includes/header.inc.php'; include_once 'includes/menu.inc.php'; ?> <!-- Formulário de Cadastro Cliente --> <div class="row container"> <form action="banco_de_dados/create.php" method="post" class="col s12"> <fieldset class="formulario" style="padding: 1px;"> <legend><!--<img src="imagens/CadCli.png" alt="[imagem]" style="width:40x; height:40px">--></legend> <br> <?php if (isset($_SESSION['msg'])): echo $_SESSION['msg']; session_unset(); endif; ?> <!-- Campo Chave --> <div class="input-field col s12"> <i class="material-icons prefix">vpn_key</i> <input type="text" name="chave" id="chave" maxlength="4" required> <label for="chave">Chave</label> </div> <!-- Campo Nome --> <div class="input-field col s12"> <i class="material-icons prefix">account_circle</i> <input type="text" name="nome" id="nome" maxlength="40" required autofocus> <label for="nome">Nome</label> </div> <!-- Campo Instituição --> <div class="input-field col s12"> <i class="material-icons prefix">account_balance</i> <input type="text" name="inst" id="inst" maxlength="40" required autofocus> <label for="inst">Instituição</label> </div> <!-- Campo Telefone --> <div class="input-field col s12"> <i class="material-icons prefix">phone</i> <input type="text" name="telefone" id="telefone" maxlength="13" required> <label for="telefone">Telefone</label> </div> <!-- Botões --> <div class="input-field col s12"> <input type="submit"style="width:108px; height:35px" value="cadastrar" class="btn green"> <input type="submit"style="width:108px; height:35px" value="Pesquisar" class="btn blue"> <input type="submit"style="width:108px; height:35px" value="Editar" class="btn orange"> <input type="submit"style="width:108px; height:35px" value="Devolver" class="btn red"> </div> </fieldset> </form> </div> <?php include_once 'includes/footer.inc.php'; ?> <?php include_once 'includes/script.inc.php'; ?>  
      create.php
       
      <?php session_start(); include_once 'conexao.php'; $id = $_POST ['id']; $nome = $_POST ['nome']; $inst = $_POST ['inst']; $data = date('y-m-d'); $telefone = $_POST ['telefone']; $chave = $_POST ['chave']; $situacao = $_POST ['situacao']; $queryInsert = $link->query("insert into tb_cadastro VALUES ('" . $id . "', '" . $nome . "','" . $inst . "','" . $data . "','" . $telefone . "','" . $chave . "','1')"); $affected_rows = mysqli_affected_rows($link); if ($affected_rows > 0): $_SESSION['msg'] = "<p class='center green-text'>" . 'Cadastrado com Sucesso!' . "<br>"; header("Location: ../cadastro.php"); endif;  
       
       
       
       

    • By alysson122010
      Galera gostaria de transformar o template desse meu web site de uma so Sidebar Widgets Column para duas tipo ficaria postagem no meio das duas Sidebar Widgets.
      Como posso fazer isso?
       
      Site que quero fazer isso: https://linkatorrents.net/
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.