none
como hago que mi pagina sea responsiva RRS feed

  • Pregunta

  • buenas necesito saber que debo modificar al código para que mi pagina sea responsiva

    agadezco su ayuda                                                                           

     <form id="form1" runat="server">
            <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
            </asp:ToolkitScriptManager>


            <table style="background-color: White;">
                <tr>
                    <td>
                        <div style="height: 100px; width: 981px; overflow-x: auto; border: 2px solid #6c6c6c; margin: 2px;">
                            <table>
                                <tr>
                                    <td>
                                        <asp:Label ID="lb_Grupo_Producto" runat="server" Text="Grupo Producto: "></asp:Label>
                                    </td>
                                    <td>
                                        <asp:DropDownList ID="DDL_Grupo_Producto" runat="server" Height="16px" Width="120px"></asp:DropDownList>

                                    </td>
                                    <td></td>
                                    <td>
                                        <asp:Label ID="lb_Agencia" runat="server" Text="Agencia: "></asp:Label>
                                    </td>
                                    <td>
                                        <asp:DropDownList ID="DDL_Agencia" runat="server" Height="16px" Width="120px"></asp:DropDownList>
                                    </td>
                                    <td></td>
                                    <td>
                                        <asp:Label ID="lb_Regional" runat="server" Text="Regional: "></asp:Label>
                                    </td>
                                    <td>
                                        <asp:DropDownList ID="DDL_Regional" runat="server" Height="16px" Width="120px"></asp:DropDownList>
                                    </td>
                                    <td></td>
                                    <td>
                                        <asp:Label ID="lb_Departamento" runat="server" Text="Departamento: "></asp:Label>
                                    </td>
                                    <td>
                                        <asp:DropDownList ID="DDL_Departamento" runat="server" Height="16px" Width="120px"></asp:DropDownList>
                                    </td>
                                    <td></td>
                                    <td>
                                        <asp:Label ID="lb_Ejecutivo" runat="server" Text="Ejecutivo: "></asp:Label>
                                    </td>
                                    <td>
                                        <asp:DropDownList ID="DDL_Ejecutivo" runat="server" Height="16px" Width="120px"></asp:DropDownList>
                                    </td>
                                </tr>
                            </table>
                        <


    • Editado wilcas jueves, 30 de junio de 2016 17:09
    jueves, 30 de junio de 2016 15:49

Respuestas

  • Hola wilcas,

    Tienes conocimientos básicos de CSS ?

    Lo menciono, porque hacer un sitio adaptable o responsivo (Responsive Design), no es tan fácil si no sabes las nociones básicas.

    Cabe resaltar que hay frameworks que te ayudan a realizarlo, pero tienes que agregar clases en el DOOM (cuerpo HTML) e incluso si quieres mayor interactividad usar los .js que tienen.

    Bootstrap

    Foundation 

    ED-GRID (en español)

    .etc

    Saludos.


    JC NaupaCrispín
    Lima - Perú

    La magia no existe, la programación SI

    jueves, 30 de junio de 2016 15:58
  • hola

    para que sea responsive esta claro que deberias aplicar alguna libreria como ser

    http://getbootstrap.com/

    entonces veras que implementando el sistem grid system usando div esto hara responsive la pagina

    Bootstrap Grid System

    pero esta claro que no debes usar <table> para definir el layout

    saludos


    Leandro Tuttini

    Blog
    MVP Profile
    Buenos Aires
    Argentina

    jueves, 30 de junio de 2016 16:01
  • hola

    >>tan facil seria arreglar la pagina Html con boostrap

    lo facil o dificil depende de cuanto te cueste aprender el sistema de layout que propone boostrap

    para alguien con expriencia te dira quee s muy simple, para alguien que recien conoce la libreria seguro sera mas dificil

    saludos


    Leandro Tuttini

    Blog
    MVP Profile
    Buenos Aires
    Argentina

    jueves, 30 de junio de 2016 16:51

Todas las respuestas

  • Hola wilcas,

    Tienes conocimientos básicos de CSS ?

    Lo menciono, porque hacer un sitio adaptable o responsivo (Responsive Design), no es tan fácil si no sabes las nociones básicas.

    Cabe resaltar que hay frameworks que te ayudan a realizarlo, pero tienes que agregar clases en el DOOM (cuerpo HTML) e incluso si quieres mayor interactividad usar los .js que tienen.

    Bootstrap

    Foundation 

    ED-GRID (en español)

    .etc

    Saludos.


    JC NaupaCrispín
    Lima - Perú

    La magia no existe, la programación SI

    jueves, 30 de junio de 2016 15:58
  • hola

    para que sea responsive esta claro que deberias aplicar alguna libreria como ser

    http://getbootstrap.com/

    entonces veras que implementando el sistem grid system usando div esto hara responsive la pagina

    Bootstrap Grid System

    pero esta claro que no debes usar <table> para definir el layout

    saludos


    Leandro Tuttini

    Blog
    MVP Profile
    Buenos Aires
    Argentina

    jueves, 30 de junio de 2016 16:01
  • wilcas,

    El tema de flexibilidad de la página según el dispositivo se basa principalmente en la estructura de la misma, una técnica para conseguirlo es el sistema de grillas. Si solo buscas adaptabilidad puedes usar algo ligero como Skeleton

    jueves, 30 de junio de 2016 16:06
  •  Que tan facil seria arreglar la pagina Html con boostrap
    • Editado wilcas jueves, 30 de junio de 2016 16:24
    jueves, 30 de junio de 2016 16:24
  • wilcas,

    ¿El código que adjuntas al inicio del hilo es lo único que necesitas adaptar?

    Entender el sistema de grillas no te tomará mas de un día, adaptarlo a lo que muestras no te toma mas de una hora.

    jueves, 30 de junio de 2016 16:32
  • podrias darme un ejemplo
    jueves, 30 de junio de 2016 16:36
  • wilcas,

    ¿Revisaste los enlaces que te compartieron? Te recomiendo los revises y si tienes una duda puntual lo comentes, por lo pronto -como ya te recomendaron- debes de cambiar el diseño del layout de tablas a elementos div.

    Lee el siguiente enlace, es introductorio y simple de entender Bootstrap Grid System

    jueves, 30 de junio de 2016 16:43
  • hola

    >>tan facil seria arreglar la pagina Html con boostrap

    lo facil o dificil depende de cuanto te cueste aprender el sistema de layout que propone boostrap

    para alguien con expriencia te dira quee s muy simple, para alguien que recien conoce la libreria seguro sera mas dificil

    saludos


    Leandro Tuttini

    Blog
    MVP Profile
    Buenos Aires
    Argentina

    jueves, 30 de junio de 2016 16:51
  • ok gracias  pense que habia una forma mas facil que no fuera volver a realizar la pagina
    jueves, 30 de junio de 2016 17:08