none
Alinhamento em ASP.NET C# RRS feed

  • Pergunta

  • Boa noite eu gostaria de saber como eu faço para fazer alinhamentos em ASP.NET usando estilo CSS, eu sou novo em programação web e tudo que eu queria fazer é conforme a imagem abaixo:

    Fico no aguardo por uma ajuda, deste já agradeço.

    Anderson Santos

    segunda-feira, 6 de maio de 2013 23:23

Respostas

  • Provavelmente você deve ter esse código em asp.net , poderia lhe mostrar usando classes em css mas vou mostrar diretamente na TAg será assim :

    <%-- Primeira div --> <div id="divEndereco" style="float:left;width:400px;"> <div style="font:18px Calibri" id="divCampoEndereco"> Endereço : </div> <div id="divValorEndereco"> <asp:TextBox ID="txtEndereco" runat="server" Width="300" /> </div> </div> <%-- Segunda div --> <div id="divBairro" style="float:left;width:200px;margin-left:20px;"> <div style="font:18px Calibri" id="divCampoBairro"> Bairro: </div> <div id="divValorBairro"> <asp:TextBox ID="txtBairro" runat="server" Width="200" /> </div> </div> <%-- Terceira div --> <div id="divCidade" style="float:left;width:200px;margin-left:20px;"> <div style="font:18px Calibri" id="divCampoCidade"> Cidade: </div> <div id="divValorCidade"> <asp:TextBox ID="txtCidade" runat="server" Width="100" /> </div> </div>

    <%-- Abaixo é para limpar o efeito de flutuante para os demais elementos -->

    <div style="clear:both;"></div>


    Espero ter ajudado , se lhe foi util marque como resposta.

    Davi Murilo Referência Principal : Jesus que ilumina minha mente.
    Referência Profissonal : http://www.tidm.com.br



    segunda-feira, 6 de maio de 2013 23:37

Todas as Respostas

  • Provavelmente você deve ter esse código em asp.net , poderia lhe mostrar usando classes em css mas vou mostrar diretamente na TAg será assim :

    <%-- Primeira div --> <div id="divEndereco" style="float:left;width:400px;"> <div style="font:18px Calibri" id="divCampoEndereco"> Endereço : </div> <div id="divValorEndereco"> <asp:TextBox ID="txtEndereco" runat="server" Width="300" /> </div> </div> <%-- Segunda div --> <div id="divBairro" style="float:left;width:200px;margin-left:20px;"> <div style="font:18px Calibri" id="divCampoBairro"> Bairro: </div> <div id="divValorBairro"> <asp:TextBox ID="txtBairro" runat="server" Width="200" /> </div> </div> <%-- Terceira div --> <div id="divCidade" style="float:left;width:200px;margin-left:20px;"> <div style="font:18px Calibri" id="divCampoCidade"> Cidade: </div> <div id="divValorCidade"> <asp:TextBox ID="txtCidade" runat="server" Width="100" /> </div> </div>

    <%-- Abaixo é para limpar o efeito de flutuante para os demais elementos -->

    <div style="clear:both;"></div>


    Espero ter ajudado , se lhe foi util marque como resposta.

    Davi Murilo Referência Principal : Jesus que ilumina minha mente.
    Referência Profissonal : http://www.tidm.com.br



    segunda-feira, 6 de maio de 2013 23:37
  • Bom dia,

    J. Anderson Santos nós desenvolvedores tempos um grande problema com folha de estilo, recentemente comecei a utilizar em meu projetos o bootstrap não sei se você já ouviu falar, ele é um plugin muito bom, os campos já vem com layout pronto bastando apenas adicionar algumas tags! vou te mandar o link para você dar uma olhada!

    <!-- Está div com classe editor-label é o cabeçalho do campo -->

    <div class="editor-label">
    @Html.LabelFor(model => model.id_estado, "Estado")
    </div>

    <!-- Está div classe editor-field é o campo que irá receber o valor digitado ou selecionado pelo usuário -->

    <div class="editor-field">
            @Html.DropDownList("id_estado", String.Empty)
    @Html.ValidationMessageFor(model => model.id_estado)
    </div>

    com apenas este trecho de código você já mantém um layout atrativo para seu site, e ainda tem como colocar o site com layout responsivo, ou seja, seu site se torna compatível com qualquer dispositivo móvel!

    quinta-feira, 9 de maio de 2013 12:02