none
Ajustar componentes da tela ao tamanho/resolução do monitor RRS feed

  • Pergunta

  • Ola pessoal,

    Já pesquisei um bocado por Net tentando achar uma solução mas não encontrei nada que me ajudasse. O problema é o seguinte :

    Tenho um site que é composto por uma tela de menu que chama outras telas, eu uso em todas as telas uma "Master Page" para que todas as telas tenham a mesma aparencia. Contudo estou efrentando dificuldades no alinhamento dos elementos de algumas telas que dependendo do tamanho do monitor ficam desalinhados. O que seria ideal usar para que isso não acontecesse ?.

    Grato pela ajuda.

    Eduardo

    quinta-feira, 22 de novembro de 2012 17:04

Respostas

  • Muito obrigado a todos que passaram alguma dica para resolver esse problema, cada um acabou contribuindo um pouco na solução.

    Eu acabei resolvendo a questão usando um pouco de CSS e principalmente usando varios <div> com o paramentro "positionrelative"

    Caso alguem precise de alguma dica é só postar.....

    Abraços,

    • Marcado como Resposta E.Gameiro segunda-feira, 26 de novembro de 2012 18:29
    segunda-feira, 26 de novembro de 2012 18:29

Todas as Respostas

  • Eduardo vc está usando CSS no seu site ?

    Junior

    quinta-feira, 22 de novembro de 2012 17:06
  • Ola Junior,

    Eu não conheço muito de CSS, mas esse meu site foi criado usando o prompt do VS2010 que cria aquele site padrão do VS. E olhando os itens que ele criou pode-se notar que existe um site.css que define algumas caracteristicas da pagina "Master"...

    Agora para os componentes que eu adicionei na pagina eu não criei nada.

    Abraços,

    Eduardo

    quinta-feira, 22 de novembro de 2012 20:41
  • faça isto:

    css:

    body
    {
        margin: 0 auto;
        background: url(../image/topoRepete.jpg);
        background-repeat: repeat-x;
    }




    .logo
    {
        /* background-image: url(../image/logo.png) no-repeat;*/
        float: left;
        padding: 0px auto auto 1px;
        margin: 0px auto;
    }


    #container
    {
        background: url (../image/topoRepete.jpg) no-repeat;
        margin: 0 auto !important;
        min-height: 100%;
        padding: 0; /*  width: 978px !important;*/
        overflow: auto;
        padding-top: 13%;
    }

    .menu
    {
        float: left;
        padding-top: 15%;
        height: 200px;
        width: 185px;
        background-color: Black;
    }

    .cadastro
    {
        float: left;
        background-color: White;
        margin: auto auto auto 10%;
        width: 720px;
        height: 700px;
    }

    .lateraldireita
    {
        float: right;
        padding-top: 15%;
        height: 200px;
        width: 185px;
        background-color: Teal;
    }

    HTML DENTRO DO BODY:

        <div id="container">
        <div class="menu">
            menu</div>
            <div class="cadastro">

    </div>

          <div class="lateraldireita">

    </div>

    </div>

    Funciona perfeitamente!!





    quinta-feira, 22 de novembro de 2012 21:11
  • Ola Vinicius.. obrigado pela ajuda, ma não estou conseguindo fazer essa pagina do jeito que eu preciso. Já tentei com (style position absolute, com style position relative ), usando CSS mas os campos não ficam alinhados como eu gostaria que ficassem, quando tento ajustar um o outro sai da posição... putz ... coisa de doido.... e eles sempre perdem o alinhamento quando mostro a pagina.

    Segue abaixo um modelo de como eu preciso que esta pagina fique... alguem poderia me dar umas dicas de como eu deveria estruturar os codigos para chegar nesse resultado...

    Grato,

    Eduardo







    • Editado E.Gameiro domingo, 25 de novembro de 2012 01:11
    domingo, 25 de novembro de 2012 01:06
  • Sabe o que eu faço? Uso um systema de grids CSS. Ajuda bastante. Que tal usar algum?

    Eu uso o http://www.getskeleton.com/ mas ele não tem nada para componentes de tela (combos e etc), mas tem o Twitter Bootstrap http://twitter.github.com/bootstrap/ que vem componentes como selects (droddownlist) e outros, assim facilita muito o desenvolvimento front end para diferentes resoluções


    Twitter: @MayogaX
    Blog: Dev Blog

    segunda-feira, 26 de novembro de 2012 10:50
  • Muito obrigado a todos que passaram alguma dica para resolver esse problema, cada um acabou contribuindo um pouco na solução.

    Eu acabei resolvendo a questão usando um pouco de CSS e principalmente usando varios <div> com o paramentro "positionrelative"

    Caso alguem precise de alguma dica é só postar.....

    Abraços,

    • Marcado como Resposta E.Gameiro segunda-feira, 26 de novembro de 2012 18:29
    segunda-feira, 26 de novembro de 2012 18:29